试图实现覆盖的可访问性,但是无法实现。

打开叠加层时,应先读取想要的标题,然后再读取对应的标签。
在最后的关闭应该阅读。并单击“退出”按钮,弹出窗口应关闭,并向用户暗示弹出窗口将要关闭。

如何做到这一点。使用了制表符索引,但无济于事。

这是我的DOM结构。

<div class="modal">
    <div class="modal-dialog">
        <div class="modal-content text-center">
            <div class="modal-body">
                <div id="show_main_heading">
                    <a href="#" class="" title="close"></a>
                    <h3 class="text-left" tabindex = "0" id="" tabindex = "-1">Header</h3>
                    <p class="text-left" tabindex = "1">Content or Description</p>
                    <p class="text-left" tabindex = "2"><label class="">*</label>required field</p>
                </div>
                <form class="form-horizontal no-summary" novalidate="novalidate">
                    <div class="row">
                        <div class="col-md-12">
                            <div class="form-group">
                              <label for="firstName" class="col-md-12 text-left" aria-hidden="true" tabindex = "3">firstname</label>
                              <div class="col-md-12">
                                <input type="text" tabindex = "4" aria-label="firstName" name="firstName" class="form-control" id="firstName" placeholder="firstname" autocomplete="off">
                              </div>
                            </div>
                        </div>
                        <div class="col-md-12">
                            <div class="form-group">
                                <div class="col-md-12">
                                    <button class="btn btn-default">Submit</button>
                                </div>
                            </div>
                        </div>
                    </div>
                </form>
                <a href="#">Privacy Policy</a>
                <p class="error-message"></p>
            </div>
        </div>
    </div>
</div>

最佳答案

Bootsrap使用escape()函数检查是否按下的键是27,如下所示:

  Modal.prototype.escape = function () {
    if (this.isShown && this.options.keyboard) {
      this.$element.on('keydown.dismiss.bs.modal', $.proxy(function (e) {
        e.which == 27 && this.hide()
      }, this))
    } else if (!this.isShown) {
      this.$element.off('keydown.dismiss.bs.modal')
    }
  }


这段代码可以是found on GitHub too

您可能想要编辑该函数中的代码,如下所示:

  Modal.prototype.escape = function () {
    if (this.isShown && this.options.keyboard) {
      this.$element.on('keydown.dismiss.bs.modal', $.proxy(function (e) {
        e.which == 27 && this.hide()
        if (e.which == 27){
              // prompt if user if he really want to close the window .
             if() // user says close window .
             { this.hide() }
             else { return false; }
        }

      }, this))
    } else if (!this.isShown) {
      this.$element.off('keydown.dismiss.bs.modal')
    }
  }

关于javascript - 如何修复引导覆盖的可访问性,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/31108366/

10-10 00:07