为什么单击 + 按 Tab 时有时会忽略 tabindex

问题描述

转到https://codepen.io/sarbbottam/full/ozrrjx

如果您只按 Tab 键,框将以正确的顺序聚焦:5、1、4、2、3

  <div class="t-a-c" id="button-container">
    <button tabindex=2>1</button>
    <button tabindex=4>2</button>
    <button tabindex=5>3</button>
    <button tabindex=3>4</button>
    <button tabindex=1>5</button>
  </div>

如果您先单击离框较远的某个位置,然后按 Tab,则第 1 个元素将首先获得焦点!

如果您按下框附近的某处,它有时会以正确的元素开头。

我知道通过单击,body 元素会获得焦点。但是为什么没有最低 tabindex !=0 的下一个元素获得焦点?看起来浏览器试图通过检查点击位置来找出下一个应该获得焦点的元素?!

解决方法

暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!

如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@)