我正在做一个bootstrap网站,与一对bootstrap 'Modals'。 我正在尝试自定义一些默认功能。

问题在于; 你可以通过点击背景来关闭模式。 有没有办法禁用这个功能? 只在特定的情态动词?

引导模态页面


当前回答

TLDR

背景:‘静态’

https://getbootstrap.com/docs/3.3/javascript/#modals-options

为背景指定静态,它不会在单击时关闭模式。

其他回答

在Options一章中,在您链接的页面中,您可以看到背景选项。通过这个值为static的选项将阻止关闭模态。 正如@PedroVagner在评论中指出的那样,你也可以通过传递{keyboard: false}来防止按Esc关闭模态。

如果你用js打开模态,使用:

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

如果您正在使用数据属性,请使用:

 <button data-target="#myModal" data-toggle="modal" data-backdrop="static" data-keyboard="false">
    Launch demo modal
 </button>`

在我的应用程序中,我使用下面的代码通过jQuery显示Bootstrap模态。

 $('#myModall').modal({
                        backdrop: 'static',
                        keyboard: true, 
                        show: true
                }); 

如果你不知道模式是否已经打开或者还没有打开,你需要配置模式选项,还有一个选项:

引导3.4

var $modal = $('#modal');
var keyboard = false; // Prevent to close by ESC
var backdrop = 'static'; // Prevent to close on click outside the modal

if(typeof $modal.data('bs.modal') === 'undefined') { // Modal did not open yet
    $modal.modal({
        keyboard: keyboard,
        backdrop: backdrop
    });
} else { // Modal has already been opened
    $modal.data('bs.modal').options.keyboard = keyboard;
    $modal.data('bs.modal').options.backdrop = backdrop;

    if(keyboard === false) { 
        $modal.off('keydown.dismiss.bs.modal'); // Disable ESC
    } else { // 
        $modal.data('bs.modal').escape(); // Resets ESC
    }
}

引导 4.3+

var $modal = $('#modal');
var keyboard = false; // Prevent to close by ESC
var backdrop = 'static'; // Prevent to close on click outside the modal

if(typeof $modal.data('bs.modal') === 'undefined') { // Modal did not open yet
    $modal.modal({
        keyboard: keyboard,
        backdrop: backdrop
    });
} else { // Modal has already been opened
    $modal.data('bs.modal')._config.keyboard = keyboard;
    $modal.data('bs.modal')._config.backdrop = backdrop;

    if(keyboard === false) { 
        $modal.off('keydown.dismiss.bs.modal'); // Disable ESC
    } else { // 
        $modal.data('bs.modal').escape(); // Resets ESC
    }
}

将选项更改为_config

试试这个:

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

有两种方法禁用自举模型区域之外的点击关闭模式

使用javascript $ (' # myModal ') .modal ({ 背景:“静态”, 键盘:假 }); 在HTML标签中使用data属性 data- background ="static" data-keyboard="false" //把这个属性写在你点击打开模态弹出窗口的按钮里。