禁止Twitter Bootstrap模式窗口关闭

本文翻译自：Disallow Twitter Bootstrap modal window from closing

I am creating a modal window using Twitter Bootstrap. 我正在使用Twitter Bootstrap创建一个模态窗口。 The default behavior is if you click outside the modal area, the modal will automatically close. 默认行为是，如果单击模态区域外，模态将自动关闭。 I would like to disable that -- ie not close the modal window when clicking outside the modal. 我想禁用它 - 即在模态外部单击时不关闭模态窗口。

Can someone share jQuery code to do this? 有人可以共享jQuery代码来做到这一点吗？

---

#1楼

参考：https://stackoom.com/question/fVy7/禁止Twitter-Bootstrap模式窗口关闭

---

#2楼

Just set the backdrop property to 'static' . 只需将backdrop属性设置为'static' 。

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

You may also want to set the keyboard property to false because that prevents the modal from being closed by pressing the Esc key on the keyboard. 您可能还希望将keyboard属性设置为false因为这会阻止通过按键盘上的Esc键关闭模式。

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

myModal is the ID of the div that contains your modal content. myModal是包含模态内容的div的ID。

---

#3楼

如果你已经初始化了模态窗口，那么你可能想要用$('#myModal').removeData("modal").modal({backdrop: 'static', keyboard: false})重置选项$('#myModal').removeData("modal").modal({backdrop: 'static', keyboard: false})以确保它将应用新选项。

---

#4楼

您还可以在模态定义中包含这些属性：

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

---

#5楼

Kind of like @AymKdn's answer, but this will allow you to change the options without re-initializing the modal. 有点像@ AymKdn的答案，但这将允许您更改选项而无需重新初始化模态。

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

Or if you need to do multiple options, JavaScript's with comes in handy here! 或者，如果你需要做多种选择，JavaScript的with在这里就派上用场了！

with ($('#myModal').data("modal").options) {
    backdrop = 'static';
    keyboard = false;
}

If the modal is already open, these options will only take effect the next time the modal is opened. 如果模态已经打开，则这些选项仅在下次打开模态时生效。

---

#6楼

In case anyone comes here from Google trying to figure out how to prevent someone from closing a modal, don't forget that there's also a close button on the top right of the modal that needs to be removed. 如果有人来谷歌试图弄清楚如何阻止某人关闭模态，请不要忘记在模式右上角还有一个需要删除的关闭按钮。

I used some CSS to hide it: 我使用了一些CSS来隐藏它：

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

Note that using "display: none;" 请注意，使用“display：none;” gets overwritten when the modal is created, so don't use that. 创建模态时会被覆盖，所以不要使用它。