Boîte de dialogue s'exécute pendant 1 sec et disparaît?

Je suis en cours d'exécution, une boîte de dialogue à l'utilisateur de quitter la page. La seule chose est qu'il tourne pendant 1 sec et disparaît? Je sais que cela a à voir avec bind('beforeunload'), mais le dialogue meurt plus tôt que vous pouvez lire.

Comment faire pour arrêter cela?

$(document).ready(function() {  
//Append dialog pop-up modem to body of page
$('body').append("<div id='confirmDialog' title='Confirm'><p><span class='ui-icon ui-icon-alert' style='float:left; margin:0 7px 20px 0;'></span>Are you sure you want to leave " + brandName + "? <br /> Your order will not be saved.</p></div>");
//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();
});
});

vous avez besoin de retourner false sinon, l'événement continue à le unload et, par conséquent, va fermer la fenêtre...
avec le retour de faux, la plupart des navigateurs ouvrez une boîte de Dialogue par Défaut: "rester" ou "quitter"
de retour false de beforeunload va juste faire une boîte d'alerte avec les "fausses" sur elle.
Lors de la copie de un exemple, essayer de le comprendre avant de le modifier. e.$('#confirmDialog') n'a pas de sens.

InformationsquelleAutor user154107 | 2011-05-19

jquery jquery-ui

153

beforeunload utilise une méthode intégrée dans le navigateur, vous avez besoin de retourner une chaîne de caractères, et le navigateur affiche la chaîne et de demander à l'utilisateur s'il souhaite quitter la page.

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

beforeunload ne peut pas rediriger l'utilisateur vers une autre page.
```
$(window).on('beforeunload', function(){
return 'Are you sure you want to leave?';
});
```
Cela fera une boîte d'alerte pop-up qui dit 'Are you sure you want to leave?' et demande à l'utilisateur s'ils veulent quitter la page.

(Mise à JOUR: Firefox n'affiche pas votre message personnalisé, il n'affiche que ses propres.)

Si vous souhaitez exécuter une fonction que la page est en cours de déchargement, vous pouvez utiliser $(window).unload(), il suffit de noter qu'il ne peut pas arrêter la page de déchargement ou de rediriger l'utilisateur. (Mise à JOUR: Chrome et Firefox de bloquer les alertes dans unload.)
```
$(window).unload(function(){
alert('Bye.');
});
```
Démo: http://jsfiddle.net/3kvAC/241/

Mise à JOUR:

$(...).unload(...) est obsolète depuis jQuery v1.8, au lieu d'utilisation:
```
$(window).on('unload', function(){
});
```
- il semble que Firefox est maintenant le blocage de l'alerte() trop
- Je suppose que les navigateurs n'aime pas lorsque vous ajoutez une alerte si le navigateur ne peut pas quitter la page. C'était juste un exemple pour montrer l'événement fonctionne ^^
- Soyez conscient, cependant, que window.onbeforeunload ne fonctionne pas sur l'iPad
- dans IE10 - ce des méthodes owkrs parfaitement pour la fermeture de l'onglet, ou en cliquant sur le lien. mais lorsque vous essayez de fermer la fenêtre ne se passe rien (pas d'invite de commandes et la fenêtre ne marche pas près non plus)
- En outre - ce qui jsfiddle marchait très bien - mais je voudrais qu'il fonctionne uniquement sur l'onglet/fenêtre étroite, pas sur un lien, cliquez sur. comment cela pourrait-il être fait? détecter un point d'ancrage sur ou quelque chose?
- peut pas les différencier de fermeture de fenêtre et cliquez sur le lien. Ouais, tu dois mettre un événement sur les ancrages et de définir une variable pour dire unload de l'ignorer.
- Pour sûr, je en tant qu'utilisateur, je n'aime pas les pages web pour me dire comment je dois utiliser mes outils 😉
InformationsquelleAutor Rocket Hazmat
3

Vous pouvez également utiliser la suite de décharger la méthode introduite par Microsoft pour atteindre cet objectif.
Cliquez sur ici pour voir la démo en direct.
```
function closeIt()
{
return "Any string value here forces a dialog box to \n" + 
"appear before closing the window.";
}
window.onbeforeunload = closeIt;
```
Cliquez sur de lire la documentation de Microsoft.
- pas de travail... le message personnalisé n'est pas arrive. Le navigateur ne montre que son message par défaut.
InformationsquelleAutor kbvishnu
0

Dans mon cas je l'utilise pour montrer un "preloader" avant d'aller à l'autre partie de ma webapp, donc cela correspond à la "preloader" qui apparaît dans la nouvelle page qui s'ouvre, pour un changement esthétique entre les pages.

Ce que cela a fonctionné pour moi (et j'ai tout essayé), était-ce:
```
function myLoader() {
//Show my Loader Script;
}
$( window ).on( 'beforeunload' , function() {
myLoader();
} );
```
InformationsquelleAutor DeathMomo

Vous devez vous connecter pour publier un commentaire.