La boîte de dialog s’exécute pendant 1 seconde et disparaît?

J’exécute une boîte de dialog lorsque l’utilisateur quitte la page. La seule chose est que ça dure 1 seconde et disparaît? Je sais que cela a à voir avec bind('beforeunload') , mais le dialog meurt plus tôt que vous ne pouvez le lire.

Comment puis-je empêcher que cela se produise?

 $(document).ready(function() { // Append dialog pop-up modem to body of page $('body').append("

Are you sure you want to leave " + brandName + "?
Your order will not be saved.

"); // Create Dialog box $('#confirmDialog').dialog({ autoOpen: false, modal: true, overlay: { backgroundColor: '#000', opacity: 0.5 }, buttons: { 'I am sure': function() { var href = $(this).dialog('option', 'href', this.href); window.location.href = href; }, 'Complete my order': function() { $(this).dialog('close'); } } }); // Bind event to Before user leaves page with function parameter e $(window).bind('beforeunload', function(e) { // Mozilla takes the var e = $('#confirmDialog').dialog('open').dialog('option', 'href', this.href); // For IE and Firefox prior to version 4 if (e){ $('#confirmDialog').dialog('open').dialog('option', 'href', this.href); } // For Safari e.$('#confirmDialog').dialog('open').dialog('option', 'href', this.href); }); // unbind function if user clicks a link $('a').click(function(event) { $(window).unbind(); //event.preventDefault(); //$('#confirmDialog').dialog('option', 'href', this.href).dialog('open'); }); // unbind function if user submits a form $('form').submit(function() { $(window).unbind(); }); });

beforeunload utilise une méthode intégrée au navigateur, vous devez lui retourner une chaîne et le navigateur affichera la chaîne et demandera à l’utilisateur s’il veut quitter la page.

Vous ne pouvez pas utiliser vos propres boîtes de dialog (ou boîtes de dialog modales jQueryUI) pour remplacer beforeunload .

beforeunload ne peut pas redirect l’utilisateur vers une autre page.

 $(window).on('beforeunload', function(){ return 'Are you sure you want to leave?'; }); 

Cela fera apparaître un message d’alerte indiquant: 'Are you sure you want to leave?' et demande à l’utilisateur s’il veut quitter la page.

(MISE À JOUR: Firefox n’affiche pas votre message personnalisé, il affiche uniquement les siens.)

Si vous voulez exécuter une fonction pendant que la page se décharge, vous pouvez utiliser $(window).unload() , notez simplement qu’il ne peut pas empêcher la page de décharger ou redirect l’utilisateur. (MISE À JOUR: Chrome et Firefox bloquent les alertes lors du unload .)

 $(window).unload(function(){ alert('Bye.'); }); 

Démo: http://jsfiddle.net/3kvAC/241/

METTRE À JOUR:

$(...).unload(...) est obsolète depuis jQuery v1.8, utilisez plutôt:

 $(window).on('unload', function(){ }); 

Vous pouvez également utiliser la méthode de déchargement suivante introduite par Microsoft pour y parvenir. Cliquez ici pour voir la démo en direct.

 function closeIt() { return "Any ssortingng value here forces a dialog box to \n" + "appear before closing the window."; } window.onbeforeunload = closeIt; 

Cliquez pour lire la documentation Microsoft.

Dans mon cas, je l’utilise pour montrer un “préchargeur” ​​avant de passer à une autre partie de mon application Web, ce qui correspond au “préchargeur” ​​qui apparaît dans la nouvelle page ouverte, pour un changement esthétique entre les pages.

Ce que cela a fonctionné pour moi (et j’ai tout essayé), c’était ceci:

 function myLoader() { // Show my Loader Script; } $( window ).on( 'beforeunload' , function() { myLoader(); } );