我试着测试Bootstrap切换按钮的实现,他们的js中的一些东西不允许我用键盘“tab”到他们。当我删除js时,我可以“tab”到复选框。谁能帮我扩展一下,这样我就可以“tab”到每个切换按钮了?
HTML
<div class="checkbox">
<label>
<input type="checkbox" data-toggle="toggle">
Option one is enabled
</label>
</div>
JS https://cdnjs.cloudflare.com/ajax/libs/bootstrap-toggle/2.2.2/js/bootstrap-toggle.min.js
JSFIDDLE https://jsfiddle.net/galnova/s2x57t2u/
3条答案
按热度按时间a1o7rhls1#
实际的
input
复选框隐藏在花哨的div.toggle-group
后面(display: none
)。这个div只是用CSS做成一个复选框的样子,并用JavaScript进行切换。事实上,复选框实际上是在场景后面被聚焦/标签化的,你只是无法在视觉上看到它,因为它是隐藏的。
如果需要,可以编写显式的JQuery来在隐藏的复选框被聚焦时聚焦外部元素。
下面是你需要包含的jQuery代码:
d5vmydt92#
一个稍微不同的方法
wqlqzqxt3#
我用这种方法…