我正在使用Twitter Bootstrap创建一个模态窗口。默认行为是，如果单击模态区域外，模态将自动关闭。我想禁用它 - 即在模态外部单击时不关闭模态窗口。
有人可以共享jQuery代码来做到这一点吗？
我相信你想将背景值设置为静态。如果要在使用Esc键时避免关闭窗口，则必须设置另一个值。
例：
<a data-controls-modal="your_div_id"
data-backdrop="static"
data-keyboard="false"
href="#">
或者如果您使用的是JavaScript：
$('#myModal').modal({
backdrop: 'static',
keyboard: false
});
正如D3VELOPER所说，以下代码解决了它：
$(function() {
$.fn.modal.Constructor.DEFAULTS.backdrop = 'static';
});
我正在使用jquery和bootstrap，只是$('#modal').removeData('bs.modal').modal({backdrop: 'static', keyboard: false});
不起作用。
我找到的最好的是将此代码添加到链接
removeData('modal')如果有人来谷歌试图弄清楚如何阻止某人关闭模态，请不要忘记在模式右上角还有一个需要删除的关闭按钮。
我使用了一些CSS来隐藏它：
<!-- Link -->
<a href="#mdl" role="button" data-backdrop="static" data-keyboard="false" data-toggle="modal" id_team="" ></a>
<-- Div -->
<div id="mdl" class="modal hide fade" tabindex="-1" role="dialog" data-keyboard="false" data-backdrop="static"></div>
请注意，使用“display：none;”创建模态时会被覆盖，所以不要使用它。
如果您想有条件地禁用#Modal .modal-header button.close {
visibility: hidden;
}
功能。您可以使用以下行在运行时将backdrop click closing选项设置为backdrop。
Bootstrap v3.xx
staticBootstrap v2.xx
jQuery('#MyModal').data('bs.modal').options.backdrop = 'static';
这将阻止已经实例化的模型将jQuery('#MyModal').data('modal').options.backdrop = 'static';
选项设置为backdrop（默认行为），从关闭开始。
您可以使用以下代码行设置模式弹出窗口的默认行为：
false现在这样做非常容易。只需添加：
$.fn.modal.prototype.constructor.Constructor.DEFAULTS.backdrop = 'static';
在你的模态分频器中。
好吧，这是你们中的一些人可能正在寻找的另一种解决方案（因为我......）
我的问题是类似的，模态框正在关闭，而我内部的iframe正在加载，所以我不得不禁用模式解除，直到Iframe完成加载，然后重新启用。
这里提出的解决方案不是100％工作。
我的解决方案是：
data-backdrop="static" data-keyboard="false"
所以我暂时阻止Modal关闭：
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;
});
}};
但随着条形图的加载，将在Iframe加载后重新启用关闭。
$modal.on("hide", function (e) {
if(is_loading !== true) {
e.preventDefault();
return false
}
});
要在模态显示后更新Bootstrap 4.1.3中的背景状态，我们使用了<button type="button" class="btn btn-info btn-md" id="myBtn3">Static
Modal</button>
<!-- Modal -->
<div class="modal fade" id="myModal3" role="dialog">
<div class="modal-dialog">
<!-- Modal content-->
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">×</button>
<h4 class="modal-title">Static Backdrop</h4>
</div>
<div class="modal-body">
<p>You cannot click outside of this modal to close it.</p>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-
dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
<script>
$("#myBtn3").click(function(){
$("#myModal3").modal({backdrop: "static"});
});
});
</script>
插件中的以下行。 Bootstrap-Modal-Wrapper。
Plugin Repository code reference
只需将backdrop属性设置为'static'即可。
$('#myModal').modal({
backdrop: 'static',
keyboard: true
})
您可能还想将keyboard属性设置为false，因为这可以通过按键盘上的Esc键来阻止模态关闭。
$('#myModal').modal({
backdrop: 'static',
keyboard: false
})
myModal是包含模态内容的div的ID。
您还可以在模态定义中包含这些属性：
<div class="modal hide fade" data-keyboard="false" data-backdrop="static">
如果您已经初始化了模态窗口，那么您可能希望使用$('#myModal').removeData("modal").modal({backdrop: 'static', keyboard: false})重置选项以确保它将应用新选项。
覆盖Dialog的Bootstrap“hide”事件并停止其默认行为（以配置对话框）。
请参阅以下代码段：
$('#yourDialogID').on('hide.bs.modal', function(e) {
e.preventDefault();
});
它在我们的情况下工作正常。
是的，你可以这样做：
<div id="myModal" tabindex="-1" role="dialog"
aria-labelledby="myModalLabel"
aria-hidden="true"
data-backdrop="static" data-keyboard="false">
有点像@ AymKdn的答案，但这将允许您更改选项而无需重新初始化模态。
$('#myModal').data('modal').options.keyboard = false;
或者如果你需要做多个选项，那么JavaScript qazxsw poi就派上用场了！
with如果模态已经打开，则这些选项仅在下次打开模态时生效。
只需添加这两件事
with ($('#myModal').data("modal").options) {
backdrop = 'static';
keyboard = false;
}
它现在看起来像这样
data-backdrop="static"
data-keyboard="false"
它将禁用转义按钮以及任何位置的单击并隐藏。
您可以通过将此JavaScript添加到页面中来禁用后台的单击关闭行为并将其设置为所有模式的默认值（确保在加载jQuery和Bootstrap JS后执行）：
<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">