javascript - 使用 jQuery 规避 tabindex 问题

Question

我正在尝试控制我的表单以及用户如何通过表单元素的 tabindex 属性与它们交互。我的所有元素都指定了 tabindex，我希望这个值得到尊重并得到正确使用。

我目前正在 Mac/Firefox 上开发，我知道默认的 Mac 系统设置将选项卡切换设置为仅输入元素和列表。但是，我想在任何系统/浏览器上覆盖此设置以及可能妨碍此操作的任何其他设置。

我正在使用 jQuery 来尝试解决这个问题。这是我此时的代码:

$(":input").keypress(function(e){
    if (e.which == 0)
    {
        tindex = parseInt($(this).attr("tabindex")) + 1;
        $(":input[tabindex='" + tindex + "']").focus();
    }
});

但是，这并没有按照我想要的方式工作。当启用默认的 Mac 设置时，这实际上会跳过 tabindex，并完全跳过非文本/文本区域项目。例如，如果我在 input[tabindex=2] 上按下“Tab”键，我将被发送到 input[tabindex=4]。如果我在 input[tabindex=2] 上并且在 input[tabindex=2] 和 input[ 之间有一个 select 框tabindex=4]，我被发送到 input[tabindex=5]。

我希望 input[tabindex=2] 将我发送到 input[tabindex=3], select[tabindex=3], input[type=radio][tabindex=3]等；基本上任何具有 3 的 tabindex。

让我知道规避此问题的任何想法。另外，如果您知道我应该查看的任何其他系统/浏览器上的其他内容，请告诉我。

Answer 1

将 e.preventDefault(); 添加到您的按键事件处理程序。这将阻止浏览器对此事件执行其默认操作。如果链接位于点击处理程序中，这也会阻止浏览器跟踪链接。

参见 documentation .