jQuery，Bootstrap-在模式隐藏上触发click事件并在输入中选择文本

Question

模态关闭时，如何在输入中选择文本？ 下面的代码正在工作-当我单击输入字段时，警报即将出现，并选择了文本。 在模式隐藏事件警报显示，但未选择文本。 这里发生了什么？

JS代码：

// Sellect text
$('.user').on('click', '#name', function(){
        $(this).select();
        alert(1);
    });
$('#myModal').on('hide.bs.modal', function(){

    $('.user').find('#name').trigger('click');

});

HTML

<div class="user">
  <p>Name
        <input type="text" name="name" id="name" value="<?php echo $user->name ?>" readonly="readonly">
  </p>
</div>

解

我发现，而不是使用hide.bs.modal事件，我应该使用hidden.bs.modal事件。 在这种情况下，脚本可以正常工作。

Answer 1

.focus由于某些原因而无法使用，在完全卸载模式之前，您将无法使元素聚焦。 我什至尝试将事件更改为hidden.bs.modal之后触发的hidden.bs.modal，这无关紧要。

我发现一种解决方法是使用setInterval并检查主体是否具有类“ modal-open”（一旦它没有触发火灾事件）

$('#myModal').on('hidden.bs.modal', function() {
  var waitForClose = window.setInterval(function() {
    if ($('body').hasClass('modal-open') == false) {
      $('.user').find('#name').trigger('focus');
      window.clearInterval(waitForClose)
    }
  }, 100);
});

http://jsfiddle.net/SeanWessell/61sc4Ldr/

Answer 2

我发现应该使用hidden.bs.modal事件，而不是使用hide.bs.modal事件。 在这种情况下，脚本可以正常工作。

Answer 3

不确定您要引用的文本字段在哪里。 是否在模态元素中。 假设您已经在脚本中指定了文档已经准备好了（ $(document).ready(..) ，或者在html中创建了html元素后加载了该脚本），您可以尝试调用$( "#name" ).focus(function() { $(this).select(); } ); 在关闭事件中。