如何处理Twitter Bootstrap中的模态关闭事件？
如何处理Twitter Bootstrap中的模态关闭事件？
提问于 2012-09-07 21:33:14
在Twitter bootstrap中，查看modals文档。我不知道是否有一种方法可以监听模式的关闭事件并执行函数。
例如，让我们以这个模式为例：
<div class="modal-header">
<button type="button" class="close close_link" data-dismiss="modal" aria-hidden="true">×</button>
<h3>Modal header</h3>
</div>
<div class="modal-body">
...
</div>
<div class="modal-footer">
<a href="#" class="btn close_link" data-dismiss="modal">Close</a>
</div>由于data-dismiss="modal"，顶部的X按钮和底部的close按钮都可以隐藏/关闭模式。所以我在想，我能不能听一下？
或者我可以像这样手动完成，我想...
$("#salesitems_modal").load(url, data, function() {
$(this).modal('show');
$(this).find(".close_link").click(modal_closing);
});你认为如何？
回答 3
Stack Overflow用户
发布于 2014-11-06 20:55:16
如果您的模式div是动态添加的，那么使用(对于bootstrap 3和4)
$(document).on('hide.bs.modal','#modal-id', function () {
alert('');
//Do stuff here
});这也适用于非动态内容。
Stack Overflow用户
发布于 2013-04-26 17:08:17
有两对情态事件，一对是“显示”和“显示”，另一对是“隐藏”和“隐藏”。从名称中可以看出，hide事件在模式接近be close时触发，例如单击右上角的十字或关闭按钮等。而hidden是在模式实际关闭后触发的。您可以自己测试这些事件。例如：
$( '#modal' )
.on('hide', function() {
console.log('hide');
})
.on('hidden', function(){
console.log('hidden');
})
.on('show', function() {
console.log('show');
})
.on('shown', function(){
console.log('shown' )
});至于你的问题，我认为你应该听听你的模式的'hide‘事件。
Stack Overflow用户
发布于 2020-07-24 06:39:55
如果您想在单击close按钮时执行某些操作，请完全按照您的描述进行操作：
<a href="#" class="btn close_link" data-dismiss="modal">Close</a>您需要使用css选择器附加事件：
$(document).on('click', '[data-dismiss="modal"]', function(){what you want to do})但是，如果你想在模式关闭时做一些事情，你可以使用已经写好的提示
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/12319171
复制相关文章
相似问题