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

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


当前回答

覆盖Dialog的Bootstrap ' hide '事件并停止其默认行为(以释放对话框)。

请参阅下面的代码片段:

   $('#yourDialogID').on('hide.bs.modal', function(e) {

       e.preventDefault();
   });

它在我们的例子中工作得很好。

其他回答

如果有人从谷歌来到这里,试图找出如何阻止某人关闭一个模式,不要忘记,在模式的右上方还有一个关闭按钮,需要删除。

我用一些CSS来隐藏它:

#Modal .modal-header button.close {
    visibility: hidden;
}

注意,使用"display: none;"会在创建模态时被覆盖,所以不要使用它。

只需将背景属性设置为“static”。

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

你可能还想将键盘属性设置为false,因为这样可以防止按下键盘上的Esc键关闭模式。

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

myModal是包含您的模式内容的div的ID。

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

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

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

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

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

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>