Maison > interface Web > js tutoriel > le corps du texte

Plusieurs façons de soumettre des formulaires en utilisant JavaScript

黄舟
Libérer: 2017-11-18 14:53:28
original
12593 Les gens l'ont consulté

Nous utilisons souvent des formulaires dans notre travail. Je pense que tout le monde les connaît. Il existe de nombreuses façons de soumettre des formulaires JavaScriptComment soumettre des formulaires ? Aujourd'hui, je vais vous présenter plusieurs méthodes de soumission. formulaires en JavaScript!

La première façon : Soumission du formulaire, ajoutez onsubmitévénement dans la balise form pour déterminer si la soumission du formulaire a réussi

<script type="text/javascript">
   function validate(obj) {
    if (confirm("提交表单?")) {
      alert(obj.value);
      return true;
    } else {
      alert(obj.value);
      return false;
    }
   }
 </script>
 <body>
  <form action="http://www.jb51.net" onsubmit="return validate(document.getElementByIdx_x(&#39;myText&#39;));"> <!—参数的这种写法注意下-->
  
    <input type="text" id="myText"/>
    <input type="submit" value="submit"/>
  
  </form>
</body>
Copier après la connexion

La deuxième façon : Déclenchez l'événement de soumission du formulaire via le bouton boutononclick="submitForm();", qui ignorera les autres balises L'attribut , tel que l'attribut onsubmit dans la balise form, n'est pas valide. À ce stade, afin d'effectuer une vérification du formulaire, vous pouvez placer le code de vérification dans la méthode submitForm();

<script type="text/javascript">
   function validate() {
    if (confirm("提交表单?")) {
      return true;
    } else {
      return false;
    }
   }
   
   function submitForm() {
    if (validate()) {
      document.getElementByIdx_x("myForm").submit();
    }
   }
 </script>
 <body>
  <form action="http://www.jb51.net" id="myForm">
  
    <input type="text"/>
    <input type="button" value="submitBtn" onclick="submitForm();"/> <!—也可以使用document.getElementByIdx_x(“该按钮的id”).click();来执行onclick事件-->
  
  </form>
</body>
Copier après la connexion

La troisième façon : Placez l'événement onsubmit dans la balise submit au lieu de la balise form. À ce stade, la vérification du formulaire échoue, cliquez sur le bouton. bouton de soumission Le formulaire est soumis directement

<script type="text/javascript">
   function validate() {
    if (confirm("提交表单?")) {
      return true;
    } else {
      return false;
    }
   }
 </script>
 <body>
  <form action="http://www.jb51.net">
  
    <input type="text"/>
    <input type="submit" value="submit" onsubmit="return validate()"/>
  
  </form>
</body>
Copier après la connexion

La quatrième façon : Ajouter un événement onclick au bouton de soumission, où cet événement est utilisé pour la vérification du formulaire soumission, et la fonction est similaire à L'événement onsubmit est ajouté à la balise form comme

<script type="text/javascript">
   function validate() {
    if (confirm("提交表单?")) {
      return true;
    } else {
      return false;
    }
   }
 </script>
 <body>
  <form action="http://www.jb51.net">
  
    <input type="text"/>
    <input type="submit" value="submit" onclick="return validate()"/>
  
  </form>
</body>
Copier après la connexion

La cinquième façon :

<body>
  <form action="http://www.jb51.net" id="myForm">
  
  <input type="text"/>
  <input type="button" value="submitBtn" id="myBtn"/>
  
  </form>
 </body>
 
  <script type="text/javascript">
  
   function validate() {
      if (confirm("提交表单?")) {
        return true;
      } else {
        return false;
      }
}
Copier après la connexion

Déclenchez le formulaire via le bouton Soumettre l'événement onclick="submitForm();" ignorera les attributs des autres balises. Par exemple, l'attribut onsubmit dans la balise form sera invalide. À ce stade, afin d'effectuer la vérification du formulaire, le code de vérification peut être placé dans la méthode submitForm(); pour vérification

function submitForm() {
      if (validate()) {
        document.getElementByIdx_x("myForm").submit();
      }
   }
  
   document.getElementByIdx_x("myBtn").onclick = submitForm;
</script>
Copier après la connexion

Résumé :

Grâce à l'introduction de cet article, nous savons qu'il existe de nombreuses façons de soumettre des formulaires en JavaScript. Chaque méthode est différente. Vous pouvez en choisir une en fonction de vos propres besoins. j'espère que cela sera utile à votre travail!

Recommandations associées :

Plusieurs méthodes et vérification de la soumission des formulaires à l'aide de JS

Le formulaire de soumission JS est rejeté par php, comment le résoudre ?

Une brève description de la façon de soumettre un formulaire en utilisant JavaScript (Utilisation du formulaire de soumission JavaScript)

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!

Étiquettes associées:
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
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal