Javascript 引导模式关闭时,关注输入
在输入字段“bootbox1”上发生模糊事件后,我想对消息使用引导模式,在模式关闭后,焦点将转到输入字段“bootbox2”。但是输入字段没有获得焦点 我做错了什么 HTMLJavascript 引导模式关闭时,关注输入,javascript,jquery,twitter-bootstrap,focus,Javascript,Jquery,Twitter Bootstrap,Focus,在输入字段“bootbox1”上发生模糊事件后,我想对消息使用引导模式,在模式关闭后,焦点将转到输入字段“bootbox2”。但是输入字段没有获得焦点 我做错了什么 HTML 您需要等待hidden.bs.modal事件触发,而不是hide.bs.modal 根据事件hide.bs.modal 当隐藏实例方法被激活时,将立即触发此事件 打电话来 鉴于hidden.bs.modal 此事件在模态已完成从中隐藏时激发 用户(将等待CSS转换完成) 由于您的焦点是在覆盖层被移除之前被调用的,因此输入
您需要等待
hidden.bs.modal
事件触发,而不是hide.bs.modal
根据事件hide.bs.modal
当隐藏实例方法被激活时,将立即触发此事件
打电话来
鉴于hidden.bs.modal
此事件在模态已完成从中隐藏时激发
用户(将等待CSS转换完成)
由于您的焦点
是在覆盖层被移除之前被调用的,因此输入还不能获取键盘焦点
<input type="text" id="bootbox" />
<input type="text" id="bootbox2" />
<div id="myModal" class="modal fade">
<div class="modal-dialog">
<div class="modal-content">
<!-- dialog body -->
<div class="modal-body">
<button type="button" class="close" data-dismiss="modal">×</button>Hello world!</div>
<!-- dialog buttons -->
<div class="modal-footer">
<button type="button" class="btn btn-primary">OK</button>
</div>
</div>
</div>
</div>
$('#bootbox').on('blur', function checkSelection(e) {
$("#myModal").on("show", function () { // wire up the OK button to dismiss the modal when shown
$("#myModal a.btn").on("click", function (e) {
console.log("button pressed"); // just as an example...
$("#myModal").modal('hide');
$('#bootbox2').focus();
// dismiss the dialog
});
});
$("#myModal").on("hide", function () { // remove the event listeners when the dialog is dismissed
$("#myModal a.btn").off("click");
$('#bootbox2').focus();
});
$("#myModal").on("hidden", function () { // remove the actual elements from the DOM when fully hidden
$("#myModal").remove();
});
$("#myModal").modal({ // wire up the actual modal functionality and show the dialog
"backdrop": "static",
"keyboard": true,
"show": true // ensure the modal is shown immediately
});
});
//this works
$('#bootbox2').on('blur', function checkSelection(e) {
$('#bootbox').focus();
});