因此，举例来说，下面的脚本：
<!-- Random content above this comment -->
<input type="text" tabindex="1" />
<input type="text" tabindex="2" />
<input type="text" tabindex="3" />
<input type="text" tabindex="4" />
<input type="text" tabindex="5" />
<input type="text" tabindex="6" />
<!-- Nothing underneath this comment -->
因此，当用户按下选项卡，并通过六个文本框去，到达最后一个，然后按下选项卡，它会去的第一个评论上面的内容，对不对？ 那么，如何让我从开始tabindex="1"再次？
不幸的是，你不能这样做，没有的JavaScript。 你可以听一个TAB（并确保它不是Shift + Tab键 ）按键您的最后一个元素上，并手动将焦点设置到处理器中的第一要素。 然而， 结合这样的逻辑键盘事件（即特定的输入方法）不是普遍和使用时可能不起作用：
我建议一个更加普遍的做法，是不可知的重点是如何变化的。
我们的想法是，你环绕你的表单元素（要在其中创建“ 的tabindex环 ”）与特殊的‘焦点后卫’的元素是可聚焦太（他们有分配的tabIndex）。 下面是修改后的HTML：
<p>Some sample <a href="#" tabindex="0">content</a> here...</p>
<p>Like, another <input type="text" value="input" /> element or a <button>button</button>...</p>
<!-- Random content above this comment -->
<!-- Special "focus guard" elements around your
if you manually set tabindex for your form elements, you should set tabindex for the focus guards as well -->
<div class="focusguard" id="focusguard-1" tabindex="1"></div>
<input id="firstInput" type="text" tabindex="2" class="autofocus" />
<input type="text" tabindex="3" />
<input type="text" tabindex="4" />
<input type="text" tabindex="5" />
<input type="text" tabindex="6" />
<input id="lastInput" type="text" tabindex="7" />
<!-- focus guard in the end of the form -->
<div class="focusguard" id="focusguard-2" tabindex="8"></div>
<!-- Nothing underneath this comment -->
现在你只听focus在那些后卫元素的事件和手动更改焦点转移到相应的字段（jQuery的用于简单起见）：
$('#focusguard-2').on('focus', function() {
// "last" focus guard got focus: set focus to the first field
$('#firstInput').focus();
});
$('#focusguard-1').on('focus', function() {
// "first" focus guard got focus: set focus to the last field
$('#lastInput').focus();
});
正如你看到的，我也确信，我们捕捉到最后一个输入时，将焦点从第一输入（例如，SHIFT + TAB在第一个输入）向后移动。 活生生的例子
需要注意的是重点警卫被分配一个tabIndex值太大，以确保他们的输入域前/后立即关注。 如果没有手动设置的tabindex对您的输入，那么这两个焦点卫士可以只具有tabindex="0"分配。
当然，你可以在动态环境中，这一切工作，以及，在动态生成的表单。 只要找出你可聚焦元素 （少平凡的任务），并使用相同的焦点卫兵包围他们。
希望帮助，让我知道，如果你有任何问题。
UPDATE
作为NBRO指出，上述实现了，如果一个页面加载完成后点击TAB（因为这会关注第一聚焦元素是选择的最后一个元素的不需要的效果#focusguard-1这将引发聚焦，最后输入。为了减轻这一点，你可以指定你想要最初侧重哪一个元素，并与其他小片的JavaScript的重点是：
$(function() { // can replace the onload function with any other even like showing of a dialog
$('.autofocus').focus();
})
有了这个，只需设定autofocus在任何你想要的元素类，它会集中在页面加载（或任何其他事件你听）。
在这里我的解决方案，您无需任何其他元素。 正如可以看到的元素将被内部循环<form>元素。
$('form').each(function(){
var list = $(this).find('*[tabindex]').sort(function(a,b){ return a.tabIndex < b.tabIndex ? -1 : 1; }),
first = list.first();
list.last().on('keydown', function(e){
if( e.keyCode === 9 ) {
first.focus();
return false;
}
});
});
是的，通过输入Tab键后，自动跳转上没有指定标签顺序合适的元素。 而且，跨栏所有“tabbable”元素后，重点将跳“外”你的网页内容，在浏览器的UI元素（标签，菜单，书签等）
我认为，最简单的方法是处理keyup上的最后一个输入和拦截TAB使用有关的事件（和Shift + Tab为此事）
这里是我的解决方案，考虑到第一输入具有“自动对焦”属性设置：
你的表单元素后添加这个（用HTML5它可以是任何标签）：
<div tabindex="6" onFocus="document.querySelector('[autofocus]').focus()"></div>
我WD建议你增加你的tabindex即。 > 100，也给的tabIndex到您的“内容” div容器，请注意，您的内容容器必须有比ex.99输入框的tabindex少。
当你在最后的输入框中手动设置专注于内容的div使用JavaScript按标签（你可以使用TAB键按键处理程序）
document.getElementById("content").focus();
你必须连锁行业的tabindex为您的“内容”将焦点设置到它。
现在，如果你按下Tab键焦点会自动切换到第一个输入框。
希望这将有助于。
谢谢
