我正在使用Twitter引导创建一个模态窗口。默认的行为是,如果你点击模式区域之外,模式将自动关闭。我想禁用,即不关闭模式窗口时,点击模式之外。
有人可以分享jQuery代码来做到这一点吗?
我正在使用Twitter引导创建一个模态窗口。默认的行为是,如果你点击模式区域之外,模式将自动关闭。我想禁用,即不关闭模式窗口时,点击模式之外。
有人可以分享jQuery代码来做到这一点吗?
当前回答
覆盖Dialog的Bootstrap ' hide '事件并停止其默认行为(以释放对话框)。
请参阅下面的代码片段:
$('#yourDialogID').on('hide.bs.modal', function(e) {
e.preventDefault();
});
它在我们的例子中工作得很好。
其他回答
如果你已经初始化了模态窗口,那么你可能想用$('#myModal'). removedata ("modal")重置选项。Modal ({background: 'static', keyboard: false})以确保它将应用新选项。
现在这样做很容易。添加:
data-backdrop="static" data-keyboard="false"
在你的模态分频器中。
把这两项加起来
data-backdrop="static"
data-keyboard="false"
现在看起来是这样的
<div class="modal fade bs-example-modal-sm" id="myModal" data-backdrop="static" data-keyboard="false" tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel" aria-hidden="true">
它将禁用逃避按钮,也点击任何地方和隐藏。
根据bootstrap 5更新的语法如下。 参考链接
<div class="modal fade" data-bs-backdrop="static" data-bs-keyboard="false" >
好吧,这是你们中的一些人可能正在寻找的另一种解决方案(就像我一样..)
我的问题是类似的,模态框关闭时,我有里面的iframe正在加载,所以我必须禁用模态解散,直到iframe完成加载,然后重新启用。
这里提出的解决方案并不是100%有效。
我的解决办法是:
showLocationModal = function(loc){
var is_loading = true;
if(is_loading === true) {
is_loading = false;
var $modal = $('#locationModal');
$modal.modal({show:true});
// prevent Modal to close before the iframe is loaded
$modal.on("hide", function (e) {
if(is_loading !== true) {
e.preventDefault();
return false
}
});
// populate Modal
$modal.find('.modal-body iframe').hide().attr('src', location.link).load(function(){
is_loading = true;
});
}};
所以我暂时阻止模态关闭:
$modal.on("hide", function (e) {
if(is_loading !== true) {
e.preventDefault();
return false
}
});
但是随着变量is_loading将重新启用关闭后Iframe加载。