jQuery beforeunload personnalisé fenêtre pop-up pour quitter une page

Salut je voudrais personnaliser mon pop up pour laisser une page, y a-t-il une façon simple de le faire?

j'utilise jQuery simple 

$(document).ready(function() {
    var myPopUp = $('#pop-up').css('display', 'block');
    $(window).bind('beforeunload', function(){
      return 'load my pop up here instead of the default browser message';
    });
});

mon html pour la pop up est masqué par défaut 

<div id="pop-up">
  <h2>Are you sure wanna leave</h2>
  <a href="#">Leave</a>
  <a href="#" class="close">Stay</a>
</div>

Merci

30
demandé sur dikei 2015-06-08 17:50:07

2 réponses

courte réponse: vous ne pouvez pas .

réponse plus longue: Pour des raisons de "sécurité" assez évidentes, il est très limité ce que vous pouvez faire quand un utilisateur essaie de naviguer loin d'une page / fermer un onglet ou de toute autre manière quitter le site. La raison est que les navigateurs veulent s'assurer complètement que vous ne pouvez pas empêcher l'utilisateur de fermer effectivement une fenêtre qu'il / elle veut à fermer. Par conséquent, l'événement beforeunload jQuery et l'événement onbeforeunload javascript est extrêmement limité dans ce qu'ils peuvent faire, et une des choses qu'ils ne peuvent certainement pas faire est d'empêcher la fermeture de la page - sauf en utilisant une méthode très standardisée et ennuyeuse que le navigateur (peut-être) autorise. Certains navigateurs vous permettent de spécifier un message, tandis que d'autres (y compris firefox) ne vous permet même pas de changer le message (parce que vous pourriez tromper l'utilisateur en demandant "puis-je adopter votre fils à naître?")... AFAIK la plupart des navigateurs permettent vous devez spécifier une chaîne de votre choix en plus de à un message standard qui ne peut pas être modifié. Certains navigateurs (aucun navigateur de bureau principal) manquent même complètement l'événement.

Ce que vous voulez atteindre est de forcer l'utilisateur à rester sur votre page, puis d'afficher un joli popup demandant de confirmer... mais tout cela pourrait certainement améliorer l'expérience utilisateur dans beaucoup de cas, vous n'avez pas à réfléchir très loin d'imaginer comment elle pourrait être abusé simplement pour ne pas permettre à l'utilisateur de jamais quitter.

pensez à comment les sites ennuyeux qui cassent le bouton arrière sont, alors imaginez qu'ils pourraient même supprimer votre capacité de fermer un onglet!

je suis tombé sur ce plutôt amusant forum question d'un utilisateur qui a passé une quantité considérable de temps à essayer de prévenir même ce petit désagrément peut - un court extrait:

Je n'aime pas onunload et onbeforeunload. Je ne pense pas qu'ils devraient Je n'ai jamais tiré sur mon installation de firefox. Je ne pense pas qu'il y est tout application utile de ces événements, pas même le Bénévent "vous avez le travail non sauvegardé!" contextuel. Quand je dis à mon navigateur Web de fermer une page web, Je ne veux pas qu'une page Web empêche (ou retarde) le navigateur de fermeture--à tout jamais.

Et juste pour ajouter un peu de peu d'informations officielles:

mozilla.org: WindowEventHandlers.onbeforeunload :

depuis le 25 mai 2011, la spécification HTML5 stipule que les appels à fenêtre.alert(), la fenêtre.confirm(), et de la fenêtre.les méthodes prompt() peuvent être ignoré pendant cet événement. Voir la spécification HTML5 pour plus détail.

incroyablement, Je ne semble pas trouver même des sources semi-officielles décrivant les problèmes de sécurité ou les limites spécifiques de ces événements à l'heure actuelle, même si je suis sûr de les avoir déjà vus auparavant... Si quelqu'un peut, n'hésitez pas à les ajouter et de supprimer ce paragraphe!

35
répondu Mikk3lRo 2015-08-14 21:12:13

cette question a été posée et répondue dans plusieurs postes d'empilements tel que ce un

si vous pouvez également préciser les circonstances de la sortie de la" page", vous pourriez probablement obtenir une réponse meilleure et appropriée. Si vous voulez prévenir que l'utilisateur devrait enregistrer avant puis vérifier le poste supérieur du lien. Si vous voulez juste prévenir avant de quitter la page, essayez cette réponse que l'utilisateur Hunter gauche: 

<script type='text/javascript'>
function goodbye(e) {
    if(!e) e = window.event;
    //e.cancelBubble is supported by IE - this will kill the bubbling process.
    e.cancelBubble = true;
    e.returnValue = 'You sure you want to leave?'; //This is displayed on the dialog

    //e.stopPropagation works in Firefox.
    if (e.stopPropagation) {
        e.stopPropagation();
        e.preventDefault();
    }
}
window.onbeforeunload=goodbye; 

</script>
5
répondu lifejuggler 2017-05-23 11:46:58