如何在Twitter Bootstrap模式中启用转义closuresfunction?
我按照其主要文档页面上的Twitter Bootstrap模式的说明进行操作
并使用了data-keyboard="true"
语法,但是转义键并没有closures模态窗口。
还有什么我失踪?
码:
<a href="#my-modal" data-keyboard="true" data-toggle="modal">Open Modal</a> <div class='modal fade hide' id='my-modal'> <div class='modal-body'> <div>Test</div> </div> </div>
看起来这是键盘事件绑定的问题。
你可以添加tabindex
属性给你模态来解决这个问题:
tabindex="-1"
所以你的完整代码应该是这样的:
<a href="#my-modal" data-keyboard="true" data-toggle="modal">Open Modal</a> <div class='modal fade hide' id='my-modal' tabindex='-1'> <div class='modal-body'> <div>Test</div> </div> </div>
有关更多信息,您可以在github上查看关于这个问题的讨论
(已更新的链接到新的TWBS存储库)
另外如果你通过JavaScript调用,使用这个:
$('#myModal').modal({keyboard: true})
在angular度我正在使用像这样:
var modalInstance = $modal.open({ keyboard: false, backdrop: 'static', templateUrl: 'app/dashboard/view/currentlyIneligibleView.html', controller: 'currentlyIneligibleCtrl', resolve: { data: function () { return param; } } });
- 背景:'静态'=>停止closures点击外部
- 键盘:false =>停止使用转义buttonclosures
将tabindex="-1"
属性添加到模态div
<div id="myModal" class="modal fade" role="dialog" tabindex="-1"> </div>