Twitter bootstrap несколько модальных ошибок

Ответ 1

Хорошо, это похоже на проблему, которая была обнаружена.

(видимо, я должен использовать ключевое слово "Uncaught RangeError: превышение максимального размера стека вызовов" вместо "слишком много рекурсии":()

Вот решения.

1. измените modal.js

в этом сообщении https://github.com/twbs/bootstrap/pull/5022

@onassar вывести решение

Последующие действия: для тех, кто работает с bootstrap-modal v2.2.0, в Принудительный метод Focus, комментируя это. $element.focus(), кажется, исправляет проблема.

Результат этого модального не фокусируется (pfft, я могу сделайте это сам: P), и, таким образом, множественные модалы не бросают вызов один-другой для фокуса (что привело к бесконечному циклу, и rangerror/recursive loop).

Надеюсь, что помогает:)

Я пробовал, и он работает. (plunker)

2. Используйте другой плагин, чтобы решить эту проблему Демо

Кажется, что он работает очень хорошо.

3. Дождитесь официального решения.

В своем roadmap они хотят переписать этот модальный плагин в какой-то момент.

Ответ 2

Вы можете применить первое решение ответа maxisam, не изменяя файлы начальной загрузки (если вы не можете или не хотите).

Просто напишите эту строку где-нибудь после загрузки файлов начальной загрузки.

$.fn.modal.Constructor.prototype.enforceFocus = function () {};

Примечание.. Это было протестировано только с помощью Bootstrap 2, а не с Bootstrap 3.

Ответ 3

Ответ SmartLove, к сожалению, не подходит; если вы идете в no-op $.fn.modal.Constructor.prototype.enforceFocus, вы должны reset его, когда ваш модальный закрывается; следующее прямо из нашего кода, о котором я не сомневаюсь, вводя в производство:

// Since confModal is essentially a nested modal it enforceFocus method
// must be no-op'd or the following error results 
// "Uncaught RangeError: Maximum call stack size exceeded"
// But then when the nested modal is hidden we reset modal.enforceFocus
var enforceModalFocusFn = $.fn.modal.Constructor.prototype.enforceFocus;

$.fn.modal.Constructor.prototype.enforceFocus = function() {};

$confModal.on('hidden', function() {
    $.fn.modal.Constructor.prototype.enforceFocus = enforceModalFocusFn;
});

$confModal.modal({ backdrop : false });

Ответ 4

4. Или вы можете сделать следующее при показе нового модального файла:

• Скрыть любой текущий модальный
• Показать новый модальный

• Когда вы закрываете новый модальный, покажите ранее скрытые модальные (-ы)

  var showModal = function ($dialog) {
      var $currentModals = $('.modal.in');
      if ($currentModals.length > 0) { // if we have active modals
          $currentModals.one('hidden', function () { 
              // when they've finished hiding
              $dialog.modal('show');
              $dialog.one('hidden', function () {
                  // when we close the dialog
                  $currentModals.modal('show');
  
              });
          }).modal('hide');
      } else { // otherwise just simply show the modal
          $dialog.modal('show');
      }
  };
  

Примечание. Я использую $.one только для того, чтобы однократно прослушивать и не заботиться о bind/unbind (on/off)

Ответ 5

Я решил это, используя стек.

var openmodals = [];
$(function(){
  var ts = new Date().getTime();
  $("div.modal").each(function( d ) {
    ts++;
    $( this ).data( "uid", ts );
  });

  // after closing > 1 level modals we want to reopen the previous level modal
  $('div.modal').on('show', function ( d ) {
    openmodals.push({ 'id' : $( this ).data( "uid" ), 'el' : this });
    if( openmodals.length > 1 ){
        $( openmodals[ openmodals.length - 2 ].el ).modal('hide');
    }
  });
  $('div.modal').on('hide', function ( d ) {
    if( openmodals.length > 1 ){
        if( openmodals[ openmodals.length - 1 ].id == $( this ).data( "uid" ) ){
            openmodals.pop(); // pop current modal 
            $( openmodals.pop().el ).modal('show'); // pop previous modal and show, will be pushed on show 
        }
    } else if( openmodals.length > 0 ){
        openmodals.pop(); // last modal closing, empty the stack
    } 
  });
});

Ответ 6

Попробуйте выполнить следующую css. Это сработало для меня.

span.select2-container {
    z-index:10050;
}

Ответ 7

Для Bootstrap 4 замените: $.fn.modal.Constructor.prototype.**enforceFocus** На $.fn.modal.Constructor.prototype.**_enforceFocus**