La meilleure façon de demander la confirmation de l'utilisateur avant de quitter la page [fermé]

dès que j'ai vu les mots "empêcher l'utilisateur" , j'ai commencé à me lamenter. Jamais empêcher l'utilisateur, seulement l'aider.

S'ils voient votre page d'inscription et le ruissellement, l' qui est leurs choix. Pop up une boîte de confirmation javascript s'ils ont déjà rempli quelques données (parce qu'ils pourraient naviguer loin accidentellement) mais le laisser à cela. S'ils n'ont pas touché le formulaire, laissez - les tranquilles. voulez pour remplir votre formulaire.

examiner d'autres méthodes pour engager les utilisateurs. Si votre formulaire est énorme et effrayant, le briser en simples morceaux gérables ou mieux encore, simplifier les choses tellement que l'utilisateur ne vous donne des données que lorsque vous en avez besoin. Par exemple, vous pourriez ne pas avoir besoin de leur adresse jusqu'à ce que vous voulez leur poster quelque chose.

en le fractionnant en plusieurs parties vous pouvez les accrocher avec une forme simple et une fois qu'ils ont investi ce temps, ils seront plus susceptible de continuer le processus.

mais ne harcelez pas les utilisateurs. S'ils ne veulent pas s'enregistrer, les harceler avec des pop-ups et des dialogues jaavscript ne fera que les chasser complètement du site.

avec cela à l'esprit, en supposant que vous essayez juste d'empêcher les gens de remplir des formulaires à moitié, il y a quelques options pour vraiment aider les gens:

1. détectez si le formulaire a changé et demandez-leur un simple confirm() message.

   C'est tout ce que vous pouvez faire. Un "pop-in" CSS ne fonctionnera tout simplement pas parce que vous ne pouvez pas contrôler* l'emplacement de la fenêtre dans l'événement de déchargement.

   *Vous mettez un écouteur d'événement sur tous les liens de votre page pour lancer quelque chose pour vérifier le formulaire, mais cela n'aide que si l'utilisateur clique sur l'un de ces liens. Cela n'aidera pas si, par exemple, l'utilisateur clique en arrière ou ferme la fenêtre. Vous CSS et javascript, mais vous vous retrouvez avec un peu de désordre.

2. conserver l'état de la forme en coulisses.

   une extension à #1. Au lieu de se chamailler avec l'utilisateur, Laissez-les aller où ils veulent mais sauvegardez le contenu du formulaire soit à session ou cookie (si cela convient) et mettez quelque chose sur la page (comme so's Orange prompt bars en haut de la page) qui leur rappelle qu'ils ont commencé à remplir un formulaire et leur donne un lien vers le formulaire.

   Quand ils cliquent sur ce lien, vous charger les données du cookie (ou session) dans le formulaire et de le laisser continuer. Ceci a l'avantage évident de les laisser faire ce qu'ils veulent sur votre site et conserve les données en toute sécurité.. ish.

   S'ils ne reviennent pas et que leur cookie/session expire, c'est leur faute. Vous ne pouvez mener un cheval à l'eau. Ce n'est pas ton travail de le forcer à boire.

Ne pas le faire.

Mais si vous voulez, essayez cette. Enregistrez les positions de la souris et détectez une poussée ascendante rapide -- l'utilisateur atteint le Grand X ou le haut à gauche ou le haut à droite. C'est peut-être votre chance d'avoir une boîte discrète à l'écran.

j'ai vu cet outil sur le web et il est diabolique.

Si vous voulez piéger les liens, vous pouvez réécrire les liens dans la page pour aller à un "vous voulez vraiment quitter?"fonction javascript, passant L'URL de destination comme argument.

Si vous voulez empêcher les utilisateurs d'utiliser leur bouton "Retour", ou les empêcher de mettre une autre URL dans la barre d'adresse arrêter. Arrêter maintenant. (1) les Navigateurs ont été faites pour prévenir exactement ce genre de comportement odieux, et (2) Même s'ils ont permis, voir les deux derniers termes de (1). C'est flipper impoli. Votre site n'est pas spécial, peu importe comment cool vous pensez qu'elle est.

window.onbeforeunload = function() { return "Message"; };

Utilisez un JavaScript comme celui-ci pour afficher un confirmation de congé message.

voici quelques approches auxquelles je pourrais penser, mais elles ne sont pas sans faille:

Whatcha allant Faire technique Détectez la position de la souris allant vers les bords du navigateur que l'utilisateur pourrait être d'aller fermer l'onglet, Fenêtre, retourner, naviguer ailleurs entre autres choses. Si oui, immédiatement que ce que peut être une erreur et qu'ils vont perdre quelque chose de très précieux. Cependant, le hic ici est que vous ne savez pas pour je sais quelles étaient leurs intentions et vous pourriez les énerver avec ce popup. Aussi, ils pourraient utiliser un tas de raccourcis tels que Ctrl+W etc à faire de même.

Vous avez Reçu du Courrier de la technique Si vous avez réussi à obtenir l'adresse email de l'utilisateur avant qu'ils ne ferment la page, vous avez touché un jackpot. Dès que l'utilisateur tape quelque chose dans la boîte de messagerie et le quitte, envoyez-le immédiatement au serveur en utilisant AJAX. Sauvegarder l'état de la page dans localStorage ou sur le serveur en utilisant un cookie ou quelque chose pour qu'il puisse être recréé plus tard. Toutes les deux heures, envoyez-leur un e-mail leur donnant un lien direct vers le formulaire précédemment enregistré, et peut-être avec des offres spéciales cette fois.

L'histoire se répète technique Ensuite, il y a la manipulation infâme de l'histoire où vous continuez à empiler la page actuelle dans l'histoire du document pour que le bouton arrière rende effectivement sans valeur.

ne mettez pas tous vos Oeufs dans un panier technique Une autre technique qui me vient à l'esprit est de créer plusieurs fenêtres à l'arrière-plan avec le formulaire d'inscription et de les synchroniser lorsque l'un des champs change. Il s'agit d'une technique classique et met vraiment le "Ne mettez pas tous vos œufs dans le même panier" dire dans l'usage de la vie réelle.

un autre avantage de cette technique impressionnante est même si l'utilisateur ferme une des fenêtres, et plus tard vient à travers une fenêtre identique cloné avec tous les champs remplis jusqu'à la date renseignée, ils pourraient se confondre et je pense qu'ils n'ont jamais fermé la page. Et devinez quoi, cette fois ils pourraient juste aller de l'avant et remplir le formulaire d'inscription. Mais il faut être prudent avec ça, car plus de 2 ou 3 clones rendront évident ce qui se passe.

Vous êtes Gagnant technique Une autre technique consiste à dire à chaque utilisateur qu'il est le Xe visiteur sur le site et d'utiliser un bon nombre arrondi pour X tels que 1000, 10000, 50000, etc. Dites-leur qu'ils peuvent réclamer leur prix une fois qu'ils vous inscrire sur le site. Imaginez comment chaque utilisateur se sent spécial quand ils atterrissent sur votre site. Le prix ne doit pas être quelque chose de tangible, il peut simplement être des coupons gratuits que vous trouvez sur les intertubes.

Où Voulez-Vous Aller Aujourd'Hui? technique¹ Il s'agit essentiellement d'une escroquerie de votre réponse. Utilisez document.location.href = 'some url' à l'intérieur de votre onbeforeunload callback pour naviguer vers une page différente avant qu'il est déchargé.

¹ Firefox seulement.

Remarque: il n'y a pas de solution miracle ici sauf si vous écrivez votre propre navigateur avec vos propres politiques de sécurité, mais ce sont toutes des optimisations que vous pouvez faire pour rendre tout à fait impossible pour les utilisateurs de quitter.

tous les navigateurs ne prennent pas en charge un popup modal, sans lequel votre page irait de l'avant et naviguerait de toute façon.

C'est une exigence terrible. Le type d'exigence qui est raisonnable dans une application de bureau, mais toute déraisonnable fonctionnalité d'un site web. Imaginez être incapable de quitter un site web.

La réponse est soit d'utiliser l'horrible boîte de confirmation et forfaitaire. Ou ne demandez pas à l'utilisateur d'entrer trop de données par page. Utiliser une entrée de données étape par étape dans le style de l'Assistant, la perte due à une navigation accidentelle est minimisée.

Vous pouvez changer la valeur de l'url en utilisant document.location.href = "www.website.com"

je peux accomplir cet exploit en utilisant des boîtes de confirmation, mais le client dit qu'elles sont trop laides.

si le problème est la laideur des boîtes popup js standard, essayez quelque chose comme ceci:http://www.sohtanaka.com/web-design/inline-modal-window-w-css-and-jquery/

en dehors de cela, je seconde ce que la plupart des gens disent: faites ceci avec une extrême prudence si vous ne voulez pas perdre des utilisateurs.