一旦出现，如何为Bootstrap模式中的特定字段设置焦点

Question

我已经看到了有关引导程序模式的几个问题，但没有一个完全像这样，所以我继续。

我有一个模态，我这样称呼onclick …

$(".modal-link").click(function(event){
  $("#modal-content").modal('show');
});

效果很好，但是当我显示模态时，我想关注第一个输入元素……在某些情况下，第一个输入元素的ID为#photo_name。

所以我尝试了

   $(".modal-link").click(function(event){
     $("#modal-content").modal('show');
     $("input#photo_name").focus();
   });

但这无济于事。最后，我尝试绑定到“
show”事件，但是即使如此，输入也不会集中。最后，仅出于测试目的，因为我怀疑这与js加载顺序有关，因此我设置了setTimeout只是为了查看是否延迟一秒钟，焦点会起作用，是的，它起作用了！但是这种方法显然是胡扯。有什么方法可以在不使用setTimeout的情况下达到与以下相同的效果？

  $("#modal-content").on('show', function(event){
    window.setTimeout(function(){
      $(event.currentTarget).find('input#photo_name').first().focus()
    }, 0500);
  });

Answer 1

尝试这个

这是旧的 DEMO：

$(document).ready(function() {
    $('#modal-content').modal('show');
    $('#modal-content').on('shown', function() {
        $("#txtname").focus();
    })
});

启动引导程序3需要使用shown.bs.modal事件：

$('#modal-content').on('shown.bs.modal', function() {
    $("#txtname").focus();
})