Question

尝试实现覆盖的可访问性，但无法实现。

打开叠加层时应首先读取标题，然后读取相应的标记。在最后，应该阅读关闭。然后单击“退出”按钮，弹出窗口应该关闭，并使用户知道弹出窗口将要关闭。

如何实现这一目标。已经使用过tab索引，但它没有帮助。

这是我的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>

Answer 1

Bootsrap使用escape（）函数来检查keypressed是否为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')
    }
  }

如何修复引导程序覆盖的可访问性

1 个答案: