我从示例中得到以下模态形式:
<!-- Button to trigger modal -->
<a href="#myModal" role="button" class="btn" data-toggle="modal">Launch demo modal</a>
<!-- Modal -->
<div id="myModal" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
<h3 id="myModalLabel">Modal header</h3>
</div>
<div class="modal-body">
Enter something: <input type="text" id="myInput">
</div>
<div class="modal-footer">
<button class="btn" data-dismiss="modal" aria-hidden="true">Close</button>
<button class="btn btn-primary">Save changes</button>
</div>
</div>
Run Code Online (Sandbox Code Playgroud)
我希望在显示模态后我的输入字段会被聚焦.
我尝试了自动对焦和将场焦点设置在$('modal').shown()事件上.它有点聚焦场(我有另一个事件,当场聚焦时显示标签)但实际上场没有聚焦,我必须按TAB再次聚焦.我也尝试过这样的事情:
$(".modal").on('shown', function() {
$(this).find("[autofocus]:first").focus();
});
Run Code Online (Sandbox Code Playgroud)
并autofocus:"autofocus"为我的字段设置属性.它产生了同样的效果.
我试过的一切都适用于模态只是一个普通的div,它会集中在页面加载上.但是当按钮触发模态时 - 没有任何作用(当然我也改变了逻辑,当模态只是一个普通的div时我可以将它集中在onload上,当我按下按钮时我会考虑它并尝试相应地解决它).
我想要的只是在加载模态后要聚焦的字段,以便它有闪烁的光标,用户可以开始输入.
唯一有用的是改变bootstrap.js本身,我把它$("#myInput").focus()放在bootstrap.js模式部分里面,但是我忘了它在哪里,第二 - 我认为改变bootstrap.js …