Comment puis-je capturer les événements de fermeture de fenêtre du navigateur sans déclencher les soumissions de formulaires ou les hyperliens ?

Capture de l'événement de fermeture de la fenêtre du navigateur tout en excluant les soumissions de formulaires et les hyperliens

L'événement beforeunload dans jQuery est conçu pour détecter le moment où un utilisateur quitte une page . Toutefois, cet événement se déclenche également lors de la soumission du formulaire, ce qui peut ne pas être souhaitable dans certains scénarios. Cet article explore une approche pour exclure les soumissions de formulaires et les hyperliens (sauf provenant d'autres cadres) de l'événement beforeunload.

Pour y parvenir, nous initialisons d'abord une variable inFormOrLink à false. Lorsqu'un utilisateur clique sur un lien hypertexte ou soumet un formulaire, nous définissons inFormOrLink sur true.

Dans le gestionnaire d'événements beforeunload, nous vérifions la valeur de inFormOrLink. Si c'est vrai, nous demandons à l'utilisateur de confirmer avec le message « Voulez-vous vraiment fermer ? » À l'inverse, si inFormOrLink est faux, nous renvoyons null pour supprimer l'invite de confirmation.

Voici un extrait de code révisé pour les versions 1.7 et supérieures de jQuery :

var inFormOrLink = false;
$('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; 
});

Pour les versions jQuery inférieures à 1.7, utilisez le code suivant :

var inFormOrLink = false;
$('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; 
});

Cette approche capture efficacement l'événement de fermeture de la fenêtre du navigateur tout en excluant les soumissions de formulaire et hyperliens (sauf provenant d'autres cadres).

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!