一旦它存在，就更改Bootstrap模態選項

Question

我正在使用Bootstrap Modal 。 我宣布它，我稱之為，我展示它......一切似乎都沒問題。

但是，如果我之前已經將“鍵盤”屬性顯示為已經存在的模態為假，我想在移動中更改它？ 我的意思是：

首先，我創建一個模態執行此操作（如您所見，我將模態put鍵盤屬性聲明為false）：

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

但后來我聲明了這個事件處理程序，這意味着如果發生“某事”，我希望將keyboard屬性設置為true。

 $('#myModal').on('shown', function(e) {
    if (something){
        $('#myModal').modal({keyboard: true});
    }
 }

所以，當我走的時候

$("#myModal").show();

事件處理程序沒有按預期執行，因為一旦按下Escape鍵，我就無法關閉模式。 但我完全確定“某些東西”是真的，我已經檢查並重新檢查了$('#myModal').modal({keyboard: true})被執行。

任何線索，為什么這不更新配置選項的值？

Answer 1

要更改已啟動的Bootstrap插件（例如Modal）上的配置設置，您需要訪問附加到元素的插件對象，例如$('#pluginElement').data['somePlugin'] ，然后在其中設置options 。

對於Modal，您需要：

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

JSFiddle演示（舊）

---

對於Bootstrap 3（如@Gerald的評論中所述），您需要bs.modal ：

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

等待模態示例

Answer 2

有點超出了OP的范圍，但現在兩次我已經搜索了相同的解決方案（我的記憶是廢話）和兩次我遇到這個問題導致我最終的答案。 我的問題是如何將已經初始化和顯示的模式（“可關閉”）變成“不可關閉的”模型。 即使另一個用戶需要這個答案，很少見，這是我根據接受的答案做的：

* 使用了bootstrap3

$('#modal').off('keyup.dismiss.bs.modal'); // disable escape key
$('#modal').data('bs.modal').options.backdrop = 'static';
$('#modal button.close').hide();

請注意，我沒有將options.keyboard屬性更改為false（后面是調用escape（）），如上所述。 我無法讓它工作，所以在查看Bootstrap源之后，我看到它所做的只是刪除'keyup.dismiss.bs.modal'的事件監聽器。

要重新啟用（在我的方案中，隱藏模型時）：

$('#modal').on('hidden.bs.modal', function (e) {
    $(this).data('bs.modal').escape(); // reset keyboard
    $(this).data('bs.modal').options.backdrop = true;
    $('button.close', $(this)).show();
});

這似乎完全笨拙，並且肯定會在即將推出的Bootstrap版本中破解，但現在可以使用......

干杯:)

Answer 3

對於bootstrap4

要在轉義按鈕上禁用關閉模式：

$('#myModal').off('keydown.dismiss.bs.modal');

要在單擊背景時禁用關閉模式：

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

正如夜間警告的那樣，這可能會在未來的bootstrap版本中出現問題。

Answer 4

您還可以在HTML標記中添加屬性： data-keyboard =“false”

<div id="myModal" class="modal hide fade" data-keyboard="false" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"></div>

這個對我有用！

Answer 5

另一種選擇，如果您不知道模態是否已經打開，並且您需要配置模態選項（Bootstrap 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').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
    }
}

謝謝@nokturnal

Answer 6

當模態已經打開時，設置背景和esckey不關閉模態

$('div[name="modal"]').data('bs.modal').options.backdrop = 'static';
$('div[name="modal"]').off('keydown.dismiss.bs.modal');

取消設置背景和關鍵esc的目的是不關閉模態

$('div[name="user_profile_modal"]').data('bs.modal').options.backdrop = true;
$('div[name="user_profile_modal"]').data('bs.modal').escape();