Twitter начальной загрузки модального несколько ошибок


Я пытаюсь иметь модальное внутри другого модального. Однако, я получил ошибку, как "слишком много рекурсии" в firefox.

Я использовал последний jQuery и Twitterbootstrap, но все еще есть эта проблема.

здесь plunker это показывает ошибку

вы можете найти "Uncaught RangeError: максимальный размер стека вызовов превышен"или" слишком много рекурсии"

ошибки в консоли

кто-нибудь знает как это исправить ? Спасибо

7 54

7 ответов:

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

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

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

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

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

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

здесь представлены решения.

1. измените модальное значение.js

в этом посте,https://github.com/twbs/bootstrap/pull/5022

@onassar поднять решение

Последующие действия: для всех работа с bootstrap-modal v2.2. 0, в метод enforceFocus, комментируя это.$элемент.фокус (), кажется, исправить вопрос.

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

надеюсь, что это поможет:)

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

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

похоже, что это работает довольно хорошо.

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

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

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

// Since confModal is essentially a nested modal it's 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. Или вы можете сделать следующее при показе нового модального:

  1. скрыть любой модальный, который в настоящее время активен
  2. показать новый модальный
  3. когда вы закрываете новый модальный, показать ранее скрытые модальные (ы)

    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)

Я решил это с помощью стека.

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
    } 
  });
});

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

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

для Bootstrap 4, заменить : $.fn.modal.Constructor.prototype.**enforceFocus** От $.fn.modal.Constructor.prototype.**_enforceFocus**