用jquery检查一个元素是否集中（具有它的轮廓）

我看到处处都找不到答案。我如何检查某个元素是否聚焦（即轮廓围绕元素），然后聚焦下一个元素，如果不是，那么焦点应该保持在哪里？例如，我有5个表单元素（即输入，标签，按钮等等）的列表;如果第三个元素被聚焦，则将焦点放在第四个元素上，如果不是正常进行。这是当用户浏览使用键盘上的Tab键的列表和它是被聚焦的标签：用jquery检查一个元素是否集中（具有它的轮廓）

JS：

var thisElem = $(this), 
    viewport = thisElem.find('.expand-viewport'), 
    viewportHeight = viewport.height(), 
    wrapper = viewport.find('ul.expand-wrapper'), 
    wrapperLi = wrapper.find('li'), 
    liLen = wrapperLi.length, 
    numShown = thisElem.find('[data-view="showhide"]').data('showalways'); 

for (var i = 0; i < liLen; i += 1) { 

    if ($(wrapperLi[i]).eq(numShown - 1).children('label').is(':focus')) {  
    $(wrapperLi[i]).eq(numShown - 1).next().children('label').focus(); 
    console.log('go to label in next li item');     
    } else { 
     thisElem.children('label').focus(); 
    } 

}

HTML：

<div id="features" class="expand-viewport"> 
     <ul class="expand-wrapper"> 
      <li> 
       <input type="checkbox" value="Smartphone (36)" id="featureSmartPhone" name="featureSmartPhone" /> 
       <label for="featureSmartPhone">Smartphone (36)</label> 
      </li> 
      <li> 
       <input type="checkbox" value="3G (42)" id="feature3g" name="feature3g" /> 
       <label for="feature3g">3G (42)</label> 
      </li> 
      <li> 
       <input type="checkbox" value="Bluetooth (63)" id="featureBluetooth" name="featureBluetooth" /> 
       <label for="featureBluetooth">Bluetooth (63)</label> 
      </li> 
      <li> 
       <input type="checkbox" value="Camera (64)" id="featureCamera" name="featureCamera" /> 
       <label for="featureCamera">Camera (64)</label> 
      </li> 
      <li> 
       <input type="checkbox" value="Email (63)" id="featureEmail" name="featureEmail" /> 
       <label for="featureEmail">Email (63)</label> 
      </li> 
     </ul> 
     <a href="#less" class="more" data-moreorless="true">More</a> 
    </div>

我希望我我的代码正确的方向。

非常感谢

来源

2011-12-20 Shaoz

有两个部分在此：

首先，你可以使用tabindex="0"设置Tab键顺序，并可以绕过一个标签。

另外，disabled元素没有收到标签的关注，所以你可以使用它。

这比使用jQuery更容易处理选项卡。

参考文献：

http://www.w3.org/TR/html4/interact/forms.html#adef-tabindex http://www.w3.org/TR/html4/interact/forms.html#disabled

来源

2011-12-20 14:54:53

我知道我们可以使用tabindex属性等，但我做的事情，需要我使用jquery时，它的上。我必须使用jQuery。那么解决方案是什么？ – Shaoz 2011-12-20 15:03:11

但是，当你不需要时为什么要使用jQuery？通过简单地使用html和浏览器本身，这是微不足道的。 – 2011-12-20 15:04:49

正如我所说我正在做一些复杂的事情，需要我使用jQuery。为了简单起见，我没有包含我的代码的其他部分。我想要的是有人帮我在jQuery中做这个，所以我可以继续... – Shaoz 2011-12-20 15:09:46

用jquery检查一个元素是否集中（具有它的轮廓）

回答

相关问题