为什么我的元素没有获得选项卡焦点?



当涉及到tab focus之类的内容时,我很无知。我正在使用jQuery DataTables。

在一个窗口中,在元素上敲击卷轴,不包括表行,但包括带有"第一,上一个,下一个,最后一个"的分页按钮的桌子页脚。

在另一个窗口中,选项卡焦点在表行的末端停止,然后返回页面顶部,跳过分页按钮的"首先,上一个,下一个,最后"。

我编码了这两个数据表,它们非常相似,就像弹出窗口本身一样。我认为这没什么大不了的,但是我开发团队中的某人为此打开了一个错误,因为这是我的代码,所以我不知道为什么有人会浪费时间来测试这样的时间,我敢肯定,我们的客户使用光标单击"分页"按钮,我怀疑其中许多人甚至都意识到反复击中标签会将它们带到那里)。

我的问题是,哪些元素可以得到焦点?为什么两个非常相似的代码的行为如此不同?我如何使它们保持一致(允许所有元素获得焦点,或者至少是分页按钮)?

我能想到的主要原因:

  1. inputbuttona(锚)元素默认为" tab-able",除非它们具有tabindex="-1"属性,该属性是非标准的,但大多数浏览器都提供支持。它可以禁用标签。如果值为-1,请从按钮中删除该属性。还要确保没有JS也将元素的tabIndex也设置为-1

  2. 除了具有tabindex(例如tabindex="0")的默认Tab-abl-tab-elements。

  3. 不太可能,但是请确保没有onfocus属性或focus处理程序将焦点重定向到附加到按钮的其他地方。tab密钥也是可捕获的,但这不太可能。

这是 demo 说明上述内容。

相关内容

最新更新