重新显示模态后jquery不关注输入

Question

所以在我的页面上，我有这个 jquery 代码，它专注于每个模式的最近输入：

$(document).ready(function(){
  $(".modal").on('shown.bs.modal', function() {
    $(this).closest("[autofocus]:first").focus();
  });
});

这在我第一次打开模式时工作正常。但是，当我点击退出模式并重新打开它时，它不会像我期望的那样关注最近的输入。

这是我的模态代码：

<a href="" data-toggle="modal" data-target="#new_section">New Section</a>
            <div class="modal fade item-plus" id="new_section" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
              <div class="modal-dialog">
                <div class="modal-content">
                  <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                    <h4 class="modal-title" id="myModalLabel">Add menu section</h4>
                  </div>
                  <div class="modal-body">
                    <h5 class="menu-section-title">
                      <%= label_tag :title %>
                      <br>
                      <%= text_field_tag :title, nil, :placeholder => "e.g. Appetizers", :class => "input-lg", autofocus: "autofocus" %>
                      <p class="error" id= "menu-section-title-errors"></p>
                      <br>
                    </h5>
                    <%= link_to_add_association "Add", f, :menu_sections, "data-dismiss" => "modal", :class => "add-section btn btn-primary", disabled: true %>
                  </div>
                </div><!-- /.modal-content -->
              </div><!-- /.modal-dialog -->
            </div><!-- /.modal -->

Answer 1

Divs,p等很多元素默认不聚焦

你应该添加tabindex，也许请试试这个

$(this).closest("[autofocus]:first").attr("tabindex","-1").focus();

但是请检查那是不是一个div