magnificpopup "Taille maximale de la pile d'appels dépassée"

Question

J'ai un stackoverflow!

J'ai suivi la source jusqu'à setFocus et onFocusIn du fichier magnificpopup js, mais je n'arrive pas à comprendre où je le génère.

Certaines lignes correspondantes (dans ce fragment d'un magnificpopup actif est fermé et certains JS (généré via AJAX) crée un autre magnificpopup

var active_magnificPopup = $.magnificPopup.instance; 
$('#frm').ajaxSubmit({ url: '<?php echo get_template_directory_uri(); ?>/handleSubscriberForms.php', type: 'post', target: '#subscriptionSubmisionTarget' }); 
active_magnificPopup.close(); 

Maintenant, le 'retour' de traitement de formulaire

jQuery(document).ready(function($) { 
    $("#ajax-thankyou").magnificPopup({ 
    type: "ajax", 
    alignTop: false, 
    closeOnContentClick: false, 
    overflowY: "scroll", // as we know that popup content is tall we set scroll overflow by default to avoid jump 
    tError: "<a href=\"%url%\">The content</a> could not be loaded." // Error message, can contain %curr% and %total% tags if gallery is enabled 
    }); 
    setTimeout(
    function() { 
     $("#ajax-thankyou").trigger("click"); 
    }, 
    125 
); 
}); 

Si je comprends bien, le premier pop-up est fermé avant la naissance de la seconde, cependant, dans les appareils mobiles, le code génère un stackoverflow et le premier popup ne se ferme jamais (le second est ouvert derrière lui)

Ce serait génial si quelqu'un pouvait clarifier un peu ... mon cerveau est douloureux à ce stade.

--- Édition après la pointe de Jai ---

Hey Jai,

On dirait que, probablement, la source est pas là où je pensais. J'ai édité le «retour» et maintenant n'utilise pas le déclencheur (code-box suivant). Le thingy fonctionne comme précédemment (comme un charme dans les ordinateurs, stakoverflow dans les mobiles).

echo ' 
    <script> 
     jQuery(document).ready(function($) { 
      setTimeout(
       function() { 
        $.magnificPopup.open({ 
         items: { 
          src: "' . get_template_directory_uri() . '/form-thankyou.php?pi=' . $post_ID . '" 
         }, 
         type: "ajax", 
         alignTop: false, 
         closeOnContentClick: false, 
         closeBtnInside: true, 
         overflowY: "scroll", 
         tError: "<a href=\"%url%\">The content</a> could not be loaded." 
        }); 
       }, 
       125 
      ); 
     }); 
    </script> 
'; 

Voici le journal de la console (où je comprends que la boucle infinie est générée entre o._setFocus et o._onFocusIn, mais je ne peux pas comprendre comment suivre ce que l'élément qui la génère)

Uncaught RangeError: Maximum call stack size exceeded jquery.tools.min.js:37 
---From here to the end is repeating--- 
f.event.trigger jquery.tools.min.js:37 
(anonymous function) jquery.tools.min.js:37 
e.extend.each jquery.tools.min.js:36 
e.fn.e.each jquery.tools.min.js:36 
f.fn.extend.trigger jquery.tools.min.js:37 
f.fn.(anonymous function) jquery.tools.min.js:37 
e.fn.extend.focus jquery.ui.core.min.js?ver=1.10.4:4 
o._setFocus magnific-popup.min.js:3 
o._onFocusIn magnific-popup.min.js:3 
f.event.dispatch jquery.tools.min.js:37 
h.handle.i jquery.tools.min.js:37 

Merci d'avance

Answer 1

J'ai également eu le même problème lorsque j'ai utilisé la méthode .trigger(). solution à ce que j'ai fait était, j'ai fait une fonction et l'a appelé à nouveau si nécessaire, de sorte que vous pouvez le faire:

function magPopup(){ 
    $("#ajax-thankyou").magnificPopup({ 
    type: "ajax", 
    alignTop: false, 
    closeOnContentClick: false, 
    overflowY: "scroll", // as we know that popup content is tall we set scroll overflow by default to avoid jump 
    tError: "<a href=\"%url%\">The content</a> could not be loaded." // Error message, can contain %curr% and %total% tags if gallery is enabled 
    }); 
} 

jQuery(document).ready(function($) { 

    magPopup(); 

    setTimeout(function() { 
     magPopup(); 
    }, 125); 
});