我正在使用Twitter引导创建一个模态窗口。默认的行为是,如果你点击模式区域之外,模式将自动关闭。我想禁用,即不关闭模式窗口时,点击模式之外。
有人可以分享jQuery代码来做到这一点吗?
我正在使用Twitter引导创建一个模态窗口。默认的行为是,如果你点击模式区域之外,模式将自动关闭。我想禁用,即不关闭模式窗口时,点击模式之外。
有人可以分享jQuery代码来做到这一点吗?
当前回答
$(document).ready(function(e){
$("#modalId").modal({
backdrop: 'static',
keyboard: false,
show: false
});
});
" background:'static'"将阻止关闭模式时,点击它之外; "keyboard: false"指定模式可以由escape键关闭(Esc) "show: false"将在页面加载完成时隐藏模式
其他回答
如果你想有条件地禁用背景单击关闭功能。您可以使用下面的行在运行时将背景选项设置为静态。
引导v3.xx
jQuery('#MyModal').data('bs.modal').options.backdrop = 'static';
引导v2.xx
jQuery('#MyModal').data('modal').options.backdrop = 'static';
这将防止已经实例化的模型将背景选项设置为false(默认行为)关闭。
你可以设置模式弹出窗口的默认行为使用下面的代码行:
$.fn.modal.prototype.constructor.Constructor.DEFAULTS.backdrop = 'static';
把这两项加起来
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">
它将禁用逃避按钮,也点击任何地方和隐藏。
bs 5
<button type="button" class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#staticBackdrop">
Launch static backdrop modal
</button>
<div class="modal fade" id="staticBackdrop" data-bs-backdrop="static" data-bs-keyboard="false" tabindex="-1" aria-labelledby="staticBackdropLabel" aria-hidden="true">
<div class="modal-dialog">
...
</div>
</div>
b 4.4
<button type="button" class="btn btn-primary" data-toggle="modal" data-target="#staticBackdrop">
Launch static backdrop modal
</button>
<div class="modal fade" id="staticBackdrop" data-backdrop="static" tabindex="-1" role="dialog" aria-labelledby="staticBackdropLabel" aria-hidden="true">
<div class="modal-dialog" role="document">
...
</div>
</div>
你可以禁用后台的点击关闭行为,并通过添加JavaScript到你的页面,使它成为所有modal的默认值(确保它在jQuery和Bootstrap JS加载后执行):
$(function() {
$.fn.modal.Constructor.DEFAULTS.backdrop = 'static';
});