我正在使用Twitter引导创建一个模态窗口。默认的行为是,如果你点击模式区域之外,模式将自动关闭。我想禁用,即不关闭模式窗口时,点击模式之外。

有人可以分享jQuery代码来做到这一点吗?


当前回答

你也可以在模态定义中包含这些属性:

<div class="modal hide fade" data-keyboard="false" data-backdrop="static">

其他回答

有点像@AymKdn的答案,但这将允许您在不重新初始化模态的情况下更改选项。

$('#myModal').data('modal').options.keyboard = false;

或者如果你需要做多个选项,JavaScript的with在这里派上用场!

with ($('#myModal').data("modal").options) {
    backdrop = 'static';
    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">

它将禁用逃避按钮,也点击任何地方和隐藏。

你可以禁用后台的点击关闭行为,并通过添加JavaScript到你的页面,使它成为所有modal的默认值(确保它在jQuery和Bootstrap JS加载后执行):

$(function() {
    $.fn.modal.Constructor.DEFAULTS.backdrop = 'static';
});

我相信您想要将背景值设置为静态。如果您想避免在使用Esc键时关闭窗口,则必须设置另一个值。

例子:

<a data-controls-modal="your_div_id"
   data-backdrop="static"
   data-keyboard="false"
   href="#">

如果你使用JavaScript:

$('#myModal').modal({
  backdrop: 'static',
  keyboard: false
});

为了在模式显示后更新Bootstrap 4.1.3中的背景状态,我们使用了Bootstrap- modal - wrapper插件中的下面一行。插件存储库代码引用。

$("#yourModalElement").data('bs.modal')._config.backdrop = (true : "static");