如何在 jquery 中设置 Tab 键顺序
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/2894539/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
how to set tab order in jquery
提问by Martin Ongtangco
I'm using Telerik controls, specifically the numerical textbox where you can set a up-down arrow to increment/decrement values in a textbox. I am required to set the tab order to move to the next field but since there's a button on the up-down arrow, the browser will go through those buttons first then move to the next textbox field.
我正在使用 Telerik 控件，特别是数字文本框，您可以在其中设置一个上下箭头来增加/减少文本框中的值。我需要设置选项卡顺序以移动到下一个字段，但由于上下箭头上有一个按钮，浏览器将首先浏览这些按钮，然后移动到下一个文本框字段。
How do you set the jquery to detect the next visible textbox/dropdown/etc input field and move to that on pressing the tab button instead of running through the buttons near it?
您如何设置 jquery 以检测下一个可见的文本框/下拉列表/等输入字段，并在按下选项卡按钮而不是通过它附近的按钮运行时移动到该字段？
回答by Vikas
$(function() {
var tabindex = 1;
$('input,select').each(function() {
if (this.type != "hidden") {
var $input = $(this);
$input.attr("tabindex", tabindex);
tabindex++;
}
});
});
回答by mVChr
You actually set this with the HTML attribute tabindexordered ascending numerically for all inputs on the page. So to skip the buttons, start with the first input on the page assigning it tabindex=1, the second tabindex=2, setting subsequent inputs accordingly. When you get to the buttons that you want to skip simply don't give them a tabindex value, or give them indices at the end of the list.
您实际上使用 HTML 属性tabindex对页面上的所有输入按数字升序进行设置。所以要跳过按钮，从页面上的第一个输入开始分配它tabindex=1，第二个tabindex=2，相应地设置后续输入。当你到达你想要跳过的按钮时，不要给它们一个 tabindex 值，或者在列表的末尾给它们索引。
回答by Gautam
You can also try this
你也可以试试这个
$('input,select :visible').each(function (i) { $(this).attr('tabindex', i + 1); });
回答by JTHouseCat
Sometimes when you are generating code or reordering elements with jQuery the solution is not to use taborder but to just make sure you put the elements in the DOM in the correct order. See example below.
有时，当您使用 jQuery 生成代码或重新排序元素时，解决方案不是使用 taborder，而是确保将元素以正确的顺序放入 DOM 中。请参阅下面的示例。
JQuery code::
var anchorB = jQuery('#anchorB');
jQuery('#divB').remove();
anchorB.insertBefore( "#anchorC" );
Before::
<a id="anchorB" href="#">Anchor B</a>
<a id="anchorA" href="#">Anchor A</a>
<a id="anchorC" href="#">Anchor C</a>
After::
<a id="anchorA" href="#">Anchor A</a>
<a id="anchorB" href="#">Anchor B</a>
<a id="anchorC" href="#">Anchor C</a>
