Предотвратить исчезновение Bootstrap Modal при щелчке снаружи или нажатии escape?

Также работает data-backdrop="static", чтобы щелкнуть и data-keyboard="false" в Esc в вашем div-модале:

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

Вы также можете использовать Direct в модели начальной загрузки.

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

Просто добавьте атрибуты data-backdrop="static" и data-keyboard="false" к этому модалу.

Eg.

<a data-controls-modal="your_div_id" data-backdrop="static" data-keyboard="false" href="#">

Вы можете использовать код ниже

$.fn.modal.prototype.constructor.Constructor.DEFAULTS.backdrop = 'static';

чтобы изменить поведение по умолчанию.

Я использую эти атрибуты, и он работает, data-keyboard="false" data-backdrop="static"

jQuery('#modal_ajax').modal('show', {backdrop: 'static', keyboard: false});

<button class="btn btn-primary btn-lg" data-backdrop="static" data-keyboard="false" data-target="#myModal" data-toggle="modal">

Если вам нужно отключить нажатие на внешнюю сторону, но разрешить нажатие кнопки

$('#myModal').modal({
    backdrop: 'static',   // This disable for click outside event
    keyboard: true        // This for keyboard event
})

Для меня работала следующая script:

// prevent event when the modal is about to hide
$('#myModal').on('hide.bs.modal', function (e) {
    e.preventDefault();
    e.stopPropagation();
    return false;
});

Этот код предотвращает модальное закрытие, если щелкнуть за пределами модального.

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

Ваш код работает, когда я выхожу на сторону модального, но если я использую html input поле внутри модального тела, тогда наведите курсор на этот ввод, затем нажмите esc ключ модальный закрыт. Нажмите здесь

<button class='btn btn-danger fa fa-trash' data-toggle='modal' data-target='#deleteModal' data-backdrop='static' data-keyboard='false'></button>

просто добавьте атрибут data-background и data-keyboard к кнопке, на которой модель открыта.

Если вам нужно настроить это после показа модального окна, вы можете использовать решение @Nabid. Однако иногда вам все же нужно разрешить какой-либо метод закрыть модальный режим. Предполагая, что у вас есть кнопка с классом really-close-the-modal, которая должна действительно закрыть модальное окно, вы можете использовать этот код (jquery):

var closeButtonClicked = false;

$('.really-close-the-modal').on('click', function () {
    closeButtonClicked = true;
});

$('#myModal').on('hide.bs.modal', function (e) {
    if (!closeButtonClicked) {
        e.preventDefault();
        e.stopPropagation();
        return false;
    }
    closeButtonClicked = false;
});

Это не очень хороший дизайн кода, но он помог мне в ситуации, когда модал показывался с анимацией загрузчика, пока не вернулся запрос ajax, и только тогда я смог узнать, нужно ли сконфигурировать модал для предотвращения "неявного" закрытие. Вы можете использовать аналогичную конструкцию, чтобы предотвратить закрытие модального окна во время его загрузки.

<div class="modal show">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">     

    <h4 class="modal-title">Modal title</h4>
     </div>
     <div class="modal-body">
      <p>One fine body&hellip;</p>
  </div>

  </div><!-- /.modal-content -->
</div><!-- /.modal-dialog -->

Я думаю, что этот codepen может вам помочь предотвратить использование модального закрытия css и bootstrap