jquery - Twitter Bootstrap 模式对话框关闭后，有没有办法将文档置于“焦点”？

Question

我正在使用 Twitter Bootstrap 进行模态对话框： http: //twitter.github.com/bootstrap/javascript.html#modals (bootstrap-modal.js)。

当我点击“esc”时，模态按预期关闭。但是，正如您从该页面上的示例中看到的那样，光标丢失了。用户必须单击浏览器窗口才能使其重新获得焦点。

这对我来说是个问题，因为我有一个主要由键盘快捷键驱动的网站。结果，一旦模态对话框关闭，用户将按下某个键，期望发生某些事情，但它不起作用。他/她首先必须在浏览器窗口中单击才能使键盘快捷键再次起作用。

我试过$('body').focus()在模态隐藏后调用（即 after $('#modalDiv').modal('hide');，但这并没有改变任何东西。

有任何想法吗？

score 2 · Accepted Answer

这是一个棘手的问题

一个可能成功的解决方法可以基于延迟焦点触发

$("#your-modal").on("hidden.bs.modal",function(e){
   setTimeout(function(){
      $('#input-to-focus').focus();         
   },300);  
});`

score 1 · Accepted Answer

尝试使用隐藏事件：

$('body').on('hidden', '.modal', function (e) {
  e && e.delegateTarget.focus();
});

score 0 · Accepted Answer

0

另请参阅此评论：

于 2012-08-13T20:44:10.383 回答

3 回答 3