当焦点位于文本输入或文本区域时，如何禁用 jQuery 键盘导航？答案

【问题标题】：How can you disable jQuery keyboard navigation when focus is on text input or textarea?当焦点位于文本输入或文本区域时，如何禁用 jQuery 键盘导航？
【发布时间】：2013-02-17 22:55:50
【问题描述】：

我正在使用以下代码以及 jQuery，以在网站的各个页面之间使用左右箭头键启用键盘导航。但是，我还需要在某些页面上有一个表格。因此，每当访问者使用其中一个表单字段时，我需要禁用键盘导航，然后在不再使用表单字段时重新启用。我可以在这段代码中添加什么来实现这一点？

$(function() {
      $(document).keyup(function(e) {
        switch(e.keyCode) {
          case 37 : window.location = $('.prev').attr('href'); break;
          case 39 : window.location = $('.next').attr('href'); break;
        }
      });
    });

【问题讨论】：

标签： jquery html keyboard-events

【解决方案1】：

您可以将事件附加到打开和关闭标志以禁用它的字段：

$(function() {
    var navEnabled = true;

    $(document).keyup(function(e) {
        if (navEnabled) {
            switch(e.keyCode) {
                case 37 : window.location = $('.prev').attr('href'); break;
                case 39 : window.location = $('.next').attr('href'); break;
            }
        }
    });

    $('.disableNav').bind('focus', function (event) {
        navEnabled = false;
    }).bind('blur', function (event) {
        navEnabled = true;
    });
});

您也可以考虑使用 :focus 选择器，但性能可能比仅使用事件来跟踪它更差。

【讨论】：

谢谢，这似乎也很有效。我对 Javascript 或 jQuery 知之甚少，无法知道上述解决方案或您的解决方案是否更好。因此，为了找到一些理由来授予一个或另一个答案，我授予上述解决方案仅仅是因为它是第一个答案并且似乎运作良好。
@user981178 这个会更好，解除绑定/重新绑定会导致很多开销，只是更新一个变量并在处理程序中检查它的开销很小。我至少可以得到一个赞成票吗？
我会为你的答案 +1 - 它的开销更少。

【解决方案2】：

如何在输入焦点上取消绑定处理程序并在模糊上再次绑定：

$(function () {
    var arrowNav = function (e) {
        switch (e.keyCode) {
        case 37:
            window.location = $('.prev').attr('href');
            break;
        case 39:
            window.location = $('.next').attr('href');
            break;
        }

    };

    $(document).on('keyup', arrowNav);

    $('#myInput').focus(function () {
        $(document).off('keyup', arrowNav);
    });
    $('#myInput').blur(function () {
        $(document).on('keyup', arrowNav);
    });
});

这里有一个jsfiddle 来演示（请务必单击“结果”区域以使其成为文档绑定工作的焦点。

【讨论】：

【解决方案3】：

聚会有点晚了，但有类似的问题。
我在这个相关问题中发现 the answer 更直接，更容易维护和更新以满足未来的需求。

[编辑]

根据 Kongi 的要求申请：

$(document).on("keydown", function (e) {
    if (e.which === 8 && !$(e.target).is("input, textarea")) {
        e.preventDefault();
    }
});

【讨论】：