Maison > interface Web > js tutoriel > Comment implémenter la confirmation avant la sortie de la page avec JavaScript ?

Comment implémenter la confirmation avant la sortie de la page avec JavaScript ?

Patricia Arquette
Libérer: 2024-11-12 22:21:02
original
249 Les gens l'ont consulté

How to Implement Confirmation Before Page Exit with JavaScript?

Confirmation JavaScript avant la sortie de la page

Pour empêcher les utilisateurs de quitter accidentellement une page sans confirmation, vous pouvez implémenter une fenêtre de confirmation à l'aide de JavaScript.

Utiliser onbeforeunload

Le onbeforeunload L'événement se déclenche lorsqu'un utilisateur est sur le point de quitter la page. Le code placé dans cet écouteur d'événement affichera une fenêtre de confirmation à l'utilisateur. Si l'utilisateur sélectionne « OK », cela indique son intention de quitter, tandis que la sélection de « Annuler » interrompra le processus de sortie. Vous ne pouvez pas rediriger l'utilisateur s'il choisit de rester sur la page.

window.onbeforeunload = function() {
  return 'Are you sure you want to leave?';
};
Copier après la connexion

Utilisation de jQuery

jQuery fournit une méthode simplifiée pour gérer l'événement beforeunload :

$(window).bind('beforeunload', function(){
  return 'Are you sure you want to leave?';
});
Copier après la connexion

Utiliser onunload

Pendant que L'événement onunload est souvent utilisé pour les tâches de nettoyage avant le déchargement d'une page, il ne peut pas rediriger l'utilisateur. Cependant, cela peut toujours être utile pour afficher un message d’adieu ou un avertissement. Notez que Chrome 14 et versions ultérieures bloquent les alertes dans onunload.

window.onunload = function() {
    alert('Bye.');
}
Copier après la connexion

Implémentation de jQuery

$(window).unload(function(){
  alert('Bye.');
});
Copier après la connexion

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!

source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Derniers articles par auteur
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal