0

我正在使用以下代码以及 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;
        }
      });
    });
4

3 回答 3

2

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

$(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选择器,但可能比仅使用事件来跟踪它的性能更差。

于 2013-02-17T23:18:48.370 回答
1

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

$(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(请务必单击“结果”区域以使其关注文档绑定工作。

于 2013-02-17T23:12:38.493 回答
-1

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

[编辑]

应 Kongi 的要求申请:

$(document).on("keydown", function (e) {
    if (e.which === 8 && !$(e.target).is("input, textarea")) {
        e.preventDefault();
    }
});
于 2016-01-21T09:36:04.103 回答