html – 选择一个选项可能会导致VoiceOver跳到页面顶部

发布时间：2020-12-14 18:59:06 所属栏目：资源来源：网络整理

导读：iOS9,启用VoiceOver的Safari. 不是100％可重复,而只是选择一个选项将导致VoiceOver焦点跳转到页面顶部的按钮. 现在可以监听所选择的选项,然后在几秒钟内强制对元素进行聚焦,但会导致不需要的UX. :focus { background-color: pink; } div button tabindex="-1

iOS9,启用VoiceOver的Safari.

不是100％可重复,而只是选择一个选项将导致VoiceOver焦点跳转到页面顶部的按钮.

现在可以监听所选择的选项,然后在几秒钟内强制对元素进行聚焦,但会导致不需要的UX.

:focus {
    background-color: pink;
  }

<div>
  <button tabindex="-1">close</button><br/><br/><br/><br/><br/><br/><br/><br/>
  <select>
    <option>Email</option>
    <option>Tobias</option>
    <option>Linus</option>
  </select>

</div>

<p>This example shows how to fill a dropdown list</p>

在生产代码(使用AngularJS)之后,在2秒钟的时间之后明确设置焦点,修复了问题,但这并不理想！谢谢.

解决方法

也许它可能会派上用场这个css属性：

.button {
 speak: spell-out;
}

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!