javascript-使用jQuery规避tabindex问题

我试图控制表单以及用户如何通过表单元素的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 [tabindex = 4]之间有一个选择框,那么我将被发送到input [tabindex = 5].

我希望输入[tabindex = 2]将我发送到输入[tabindex = 3],选择[tabindex = 3],输入[type = radio] [tabindex = 3]等；基本上任何具有3的tabindex.

让我知道解决这个问题的任何想法.另外,请告诉我您是否应该了解其他系统/浏览器上的其他信息.

解决方法:

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

参见documentation.

标签：tabindex,forms,javascript,jquery
来源： https://codeday.me/bug/20191107/2003412.html