禁止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. 創建模態時會被覆蓋，所以不要使用它。