Capturer les événements de fermeture de fenêtre du navigateur sans interférence de formulaire
Il est courant de souhaiter un événement qui se déclenche spécifiquement lorsqu'une fenêtre (ou un onglet) du navigateur se ferme . Cependant, l'événement beforeunload, qui est généralement utilisé à cette fin, réagit également aux soumissions de formulaires. Comment pouvons-nous exclure les actions liées au formulaire du déclenchement de cet événement ?
Réponse :
L'événement beforeunload se déclenche chaque fois que l'utilisateur quitte la page actuelle, quelle qu'en soit la raison. . Cela inclut les soumissions de formulaires, les clics sur les liens et la navigation directe vers une autre page. Pour exclure ces actions, nous pouvons exploiter le code suivant :
var inFormOrLink; $('a').on('click', function() { inFormOrLink = true; }); $('form').on('submit', function() { inFormOrLink = true; }); $(window).on("beforeunload", function() { return inFormOrLink ? "Do you really want to close?" : null; })
Alternativement, si vous utilisez des versions de jQuery antérieures à 1.7, ce qui suit est recommandé :
var inFormOrLink; $('a').live('click', function() { inFormOrLink = true; }); $('form').bind('submit', function() { inFormOrLink = true; }); $(window).bind("beforeunload", function() { return inFormOrLink ? "Do you really want to close?" : null; })
Dans cette solution, lorsque l'utilisateur clique sur un lien hypertexte ou soumet un formulaire, un indicateur inFormOrLink est défini sur true. Lors de l'événement beforeunload, cet indicateur est vérifié, et s'il est faux, l'événement n'est pas capturé.
Remarque importante :
Il convient de noter que d'autres gestionnaires d'événements peuvent empêcher les soumissions de formulaires ou la navigation. Dans de tels cas, l'événement beforeunload se déclenchera toujours lorsque la fenêtre est fermée, entraînant une perte de l'invite de confirmation. Pour atténuer cela, enregistrez l'heure des événements de clic et de soumission et vérifiez si le pré-déchargement se produit beaucoup plus tard, ce qui permet de gérer de telles situations.
Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!