Maison > interface Web > js tutoriel > Comment puis-je arrêter de manière fiable la soumission d'un formulaire JavaScript et revenir en arrière ?

Comment puis-je arrêter de manière fiable la soumission d'un formulaire JavaScript et revenir en arrière ?

Susan Sarandon
Libérer: 2024-12-23 12:50:22
original
1021 Les gens l'ont consulté

How Can I Reliably Stop JavaScript Form Submission and Navigate Back?

Arrêter la soumission du formulaire avec JavaScript

La soumission du formulaire peut être empêchée en JavaScript en utilisant diverses méthodes. Une méthode mentionnée dans la question consiste à renvoyer false de la fonction de validation lorsque des conditions spécifiques sont remplies. Cependant, dans ce cas, le formulaire est soumis même après avoir appelé la fonction returnToPreviousPage().

Pour arrêter efficacement la soumission du formulaire et revenir à la page précédente, envisagez les approches suivantes :

1. PreventDefault() et Return False :

Ajoutez la méthode PreventDefault() au gestionnaire d'événements onsubmit du formulaire et renvoyez false à partir de la fonction de validation. Cela empêchera le navigateur de soumettre le formulaire et déclenchera la fonction returnToPreviousPage() pour revenir à la page précédente :

<form onsubmit="event.preventDefault(); validateMyForm();">
Copier après la connexion
function validateMyForm() {
  if (condition not met) {
    alert("Validation failed");
    returnToPreviousPage();
    return false;
  } else {
    alert("Validation passed");
    return true;
  }
}
Copier après la connexion
Copier après la connexion

2. Valeur de retour de la fonction :

Utilisez la valeur de retour de la fonction de validation pour contrôler la soumission du formulaire. Dans le gestionnaire d'événements onsubmit, spécifiez le nom de la fonction de validation et définissez la valeur de retour de la fonction pour arrêter ou autoriser la soumission :

<form onsubmit="return validateMyForm();">
Copier après la connexion
function validateMyForm() {
  if (condition not met) {
    alert("Validation failed");
    returnToPreviousPage();
    return false;
  } else {
    alert("Validation passed");
    return true;
  }
}
Copier après la connexion
Copier après la connexion

Remarque : Si vous utilisez Chrome 27.0.1453.116 m, il peut être nécessaire de définir le champ returnValue du paramètre event sur false pour que le code ci-dessus fonctionne efficacement.

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!

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