选项卡键按忽略隐藏区域a&按钮元素
在上面的链接中，我添加了一些带有<a>和<button>元素的<button>。我有一个带有一些<a>标签的右侧条形div，底部有一个页脚。它包含很少的<button>元素。
问题是，当我通过键盘按选项卡键时，重点放在页脚div <button>元素上。但是，在调用jQuery函数时，应该显示页脚div。按tab键时不应显示。同样的问题也发生在右侧的酒吧分区中。右侧条形div包含<a>标记。当我单击文本“打开右侧分区”时，应该显示它。但是，当我按下选项卡键时，它也会显示出来。
我为这个问题找到了两种解决办法。
- 如果我在页脚和右侧栏类中添加
display: none，而不是bottom: -40px和transform: translateX(100%)。 tabindex="-1"将解决聚焦问题
我知道以上两种解决方案可以忽略聚焦隐藏的div元素。但是，我不能用这两种解决方案。在我的例子中，我的应用程序中有、n个隐藏div、(隐藏div包含n个<a> & <button>)。
当我按tab键时，有没有其他方法可以编程地忽略<a> & <button>从隐藏的divs (非普通div)中聚焦？
回答 2
Stack Overflow用户
发布于 2019-09-04 03:38:04
<button tabindex="2" >Tab focus 2</button>
<button tabindex="1" >Tab Should not focus</button>
<button tabindex="3" >Tab focus 3</button>
<button tabindex="4" >Tab focus 4</button>
<button tabindex="5" >Tab focus 5</button>
您只需操作tabindex属性来跳过焦点，基本上您可以从更大的数字开始并继续，并给出较小的no --您想要隐藏表单选项卡焦点的元素。
p.s:在页面中，所有具有焦点能力的元素都使用tabindex属性
Stack Overflow用户
发布于 2019-09-04 05:55:18
在你的例子中，什么都不隐藏。每个div都是可见的，因此选项卡行为是完全正确的。
作为注释中的statet，您应该初始化隐藏在css style=中的页脚div“display:none；”。
若要在更改事件或按钮通过jQuery单击后使其可见，您可以执行以下操作：
$('div.footer').css('display','block');https://stackoverflow.com/questions/57786940
复制
相似问题
选项卡键按忽略页html中的某些tabindex元素
(1) A& -> A&，(2) A& -> A&，(3) A& -> &，(4) A& -> &&
按钮按类隐藏其他元素
按选项卡键改变按钮颜色
使按钮忽略按下的c#键
领取专属 10元无门槛券
AI混元助手 在线答疑
洞察 腾讯核心技术
剖析业界实践案例
腾讯云开发者
