时间戳

首页 > 解决方案 > 在没有 tabindex = -1 属性的情况下打开模式时，有没有办法将焦点移动到模式？

javascript - 在没有 tabindex = -1 属性的情况下打开模式时，有没有办法将焦点移动到模式？

问题描述

我知道当模态打开时，焦点会由于tabindex=-1属性而转移到模态。

tabindex=-1有没有办法在没有属性的情况下打开模态时将焦点移动到模态？

标签： javascripthtmlmodal-dialogtabindexweb-accessibility

解决方案

确实有，这也是使用 JavaScript 聚焦模态框的关闭按钮的正确方法。这是一个详细说明的例子。

<div class='modal' aria-describedby='modalDescription'>
  <a href="#" class="close" title="close button">X</a>
  <div class='modal-content'>
    <p class='text' >
    This is a dialog window which 
    </p>
    <button type="submit" aria-label="Know More">Know More</button>
    <a href="#" class="redirect-close"></a>
  </div>
</div>

现在在模型上使用 jquery 或本机 JavaScript 打开第一个焦点关闭按钮下一个选项卡将焦点保持在 DOM 中的模型可焦点元素上，直到.redirect-close到达链接然后它将焦点移回带有类的关闭按钮.close

推荐阅读