当modal打开时，如果没有tabindex=-1属性，有没有办法将焦点转移到modal上？

Question

我知道焦点转移到模版上是由于 tabindex=-1 属性时，将焦点移到模态上。

是否有办法在打开模态时，不使用该属性将焦点移动到模态上？tabindex=-1 属性？

Answer 1

确实是有的，这也是使用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或native javaScript对model打开时先聚焦关闭按钮，接下来tabbing会将焦点保持在model中可聚焦的DOM元素上，直到 .redirect-close 链接，那么它将把焦点移回关闭按钮上，并将其与类 .close