Javascript Confirmation Box on Exit

Question

J'ai eu un problème étrange avec la configuration d'une boîte de confirmation à la sortie de l'utilisateur.

Voici le code:

function closeIt() { 
    var message = "Click 'Cancel' right now!"; 

    evt=(typeof evt == 'undefined') ? window.event:evt; 
    evt ? evt.returnValue = message:null; 
    return message; 
    } 
    window.onbeforeunload = closeIt; 

Quelles sont les fonctionnalités que j'aimerais mettre en œuvre? Lorsque l'utilisateur clique sur Annuler, j'aimerais rediriger la page.

J'ai eu des millions d'idées, aucune d'entre elles ne fonctionnait. Des idées?

Modifier Voici ce que je voudrais avoir: utilisateurs tente de fermer son onglet du navigateur, je voudrais afficher petite boîte de confirmation, s'il clique sur OK -> puis fermez l'onglet, s'il clique sur Annuler -> ne ferme pas l'onglet et redirige l'utilisateur pour enregistrer la page.

J'ai essayé des millions de méthodes, rencontré des centaines de problèmes.

Answer 1

Fonctionne pour moi confirm. Je n'ai sincèrement pas compris comment vous avez essayé de le résoudre, étant donné qu'aucun confirm n'est publié.

window.onbeforeunload = function(){ 
    return confirm("Click 'Cancel' right now!"); 
} 

Answer 2

Je travaille avec le même type de problème (avec Dojo v1.3) (voir http://jsfiddle.net/ZPxtj/19/).

Il ressemble à:

---

window.onbeforeunload = function() { 
    ... 
}; 

fonctionne bien.

Answer 3

Alors ... comment obtenir l'action de l'utilisateur alors?

Vous ne pouvez pas, directement. Le navigateur prend en charge la visualisation de la confirmation, et soit continuer la navigation si OK, soit ne rien faire si Annuler. Vous n'arrivez pas à savoir si l'utilisateur a cliqué sur OK jusqu'à ce que vous obteniez le unload final, à ce stade, il est trop tard.

Une stratégie consiste à deviner que, si l'utilisateur est toujours là sur la page un peu de temps après la beforeunload, ils ont probablement cliqué sur Annuler:

var redirecting= false; 
window.onbeforeunload = function() { 
    if (redirecting) return; 
    setTimeout(function() { 
     setTimeout(function() { 
      redirecting= true; 
      location.href= 'http://www.example.com/'; 
     }, 2000); 
    }, 0); 
    return 'Boo hoo, please stay with me'; 
}; 

(Le drapeau redirecting est d'arrêter notre propre navigation aussi provoquant un avertissement beforeunload, le double-timeout est de s'assurer que le délai se produit une seconde après la fermeture de la boîte de confirmation, plutôt qu'une seconde après son ouverture.)

Malheureusement, cela reste très peu fiable la redirection même si l'utilisateur a cliqué sur OK, mais t La page vers laquelle ils naviguent prend plus de deux secondes pour commencer à charger.

Une autre façon serait de toujours retourner rien de beforeunload invite, puis configurez votre propre confirm() explicite sur un 0-timeout. Mais ce n'est pas fiable cross-browser, car les navigateurs ne veulent pas vraiment laisser les pages faire des choses potentiellement désagréables comme ça. Cela fonctionne un peu sur IE et fonctionne presque sur Firefox, à condition que vous cassiez le cache arrière/avant (car cela cache la page avant que la confirmation puisse arriver).

En résumé, il n'y a pas vraiment de bonne solution. Quel est le cas d'utilisation pour rediriger l'utilisateur? Peut-être pourriez-vous essayer de remplacer le contenu de la page actuelle plutôt que de faire une redirection?

Answer 4

Avez-vous essayé de démarrer un événement de minuteur dans le gestionnaire d'événements onbeforeUnload? Ils ne tirent généralement pas tant qu'il y a un dialogue modal sur l'écran comme la confirmation. (Cela peut dépendre de la plateforme!)

La minuterie peut être mise à mort automatiquement lorsque l'utilisateur appuie sur OK. Si ce n'est pas le cas, vous devez l'arrêter en cas de surcharge.

Si votre minuteur se déclenche, vous redirigez la page dans le gestionnaire d'événements du minuteur.

Answer 5

c'est ce que vous voulez?

<script type="text/javascript"> 
window.onbeforeunload = function (evt) { 
var message = 'Are you sure you want to leave?'; 
if (typeof evt == 'undefined') { 
evt = window.event; 
} 
if (evt) { 
evt.returnValue = message; 
window.location = "http://www.google.com/"; 
} 
return message; 
} 
</script> 

vous pouvez simplement remplacer google.com par votre URL. J'ai utilisé google.com pour tester :)
Cheers!