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

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


当前回答

好吧,这是你们中的一些人可能正在寻找的另一种解决方案(就像我一样..)

我的问题是类似的,模态框关闭时,我有里面的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加载。

其他回答

正如D3VELOPER所说,下面的代码解决了它:

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

我使用jquery和bootstrap和简单removeData('modal')不工作。

我发现最好的是把这个代码添加到链接中

<!-- 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>

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

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

你可以设置模式弹出窗口的默认行为使用下面的代码行:

 $.fn.modal.prototype.constructor.Constructor.DEFAULTS.backdrop = 'static';

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

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