Maison  >  Article  >  interface Web  >  Quelles sont les manières de soumettre des formulaires en JavaScript ?

Quelles sont les manières de soumettre des formulaires en JavaScript ?

清浅
清浅original
2019-02-28 16:10:588694parcourir

Il existe trois façons de soumettre des formulaires en JavaScript : directement via le bouton de soumission pour implémenter la soumission du formulaire, via le bouton pour déclencher l'événement onclick pour implémenter la soumission du formulaire, et le bouton de soumission pour déclencher l'événement onsubmit pour implémenter le formulaire. soumission

Formulaire dans la page La soumission est un moyen très courant. Ensuite, je présenterai plusieurs méthodes pour mettre en œuvre la soumission de formulaire dans cet article, qui a une certaine valeur de référence. J'espère qu'il sera utile à tout le monde

.

Quelles sont les manières de soumettre des formulaires en JavaScript ?

[Cours recommandés : tutoriel javascript]

Méthode 1

Obtenez l'effet de soumission du formulaire en utilisant le bouton de soumission

Exemple :

<form action="demo.asp" method="post">
    First name:<br>
    <input type="text" name="firstname" value="Mickey"><br>
    Last name:<br>
    <input type="text" name="lastname" value="Mouse"><br><br>
    <input type="submit" value="提交">
</form>
<script>
/*这里是提交表单前的非空校验*/
    $("form").submit(function () {
        var first = $("input[name=&#39;firstname&#39;]").val();
        var last = $("input[name=&#39;lastname&#39;]").val();
        if (first == "" || first == null || first == undefined) {
            alert("first");
            return false;/*阻止表单提交*/
        } else if (last == "" || last == null || last == undefined) {
            alert("last");
            return false;/*阻止表单提交*/
        } else {
            alert("提交");
            return true;
        }
    })
</script>

Comme indiqué dans le code ci-dessus, lorsque nous cliquons sur le bouton Soumettre, les données du formulaire seront envoyées à une page nommée demo.asp. La soumission de formulaire mise en œuvre par le bouton Soumettre est une soumission directe. Mais nous pouvons utiliser certaines méthodes pour vérifier la nécessité de soumettre un formulaire ou pour effectuer une soumission de formulaire en fonction de nos propres besoins personnalisés

Méthode 2

Vous pouvez utiliser le bouton bouton Pour implémenter la soumission du formulaire, lorsque vous cliquez sur le bouton, l'événement onclick est déclenché et la fonction en JavaScript détermine si le contenu d'entrée est vide. S'il est vide, false est renvoyé et la soumission du formulaire n'aura pas lieu à ce moment. . S'il n'est pas vide, le formulaire est soumis à l'adresse indiquée par l'action.

<script type="text/javascript">
         function check(form) {
              if(form.userId.value==&#39;&#39;) {
                    alert("请输入用户帐号!");
                    form.userId.focus();
                    return false;
               }
               if(form.password.value==&#39;&#39;){
                    alert("请输入登录密码!");
                    form.password.focus();
                    return false;
                }
                  document.myform.submit();
            }
    </script>
<form action="demo.asp" name="myform" method="post">
    用户帐号<input type=text name="userId" size="18" value="" ><br>
    登录密码<input type="password" name="password" size="19" value=""/>      
    <input type=button name="submit1" value="登陆" onclick="check(this.form)">  
</form>

Remarque : Dans cette méthode, puisque le bouton n'a pas la fonction de soumission automatique, les instructions JavaScript sont utilisées pour implémenter la soumission

Méthode 3

La soumission du formulaire s'effectue en utilisant le bouton Soumettre. Lorsque nous cliquons sur le bouton de soumission, l'événement onsubmit est d'abord déclenché, puis la fonction en JavaScript détermine si le contenu d'entrée est vide. Si le contenu d'entrée est vide, false est renvoyé et le formulaire n'est pas soumis. Si le contenu saisi n'est pas vide, il sera soumis à l'adresse spécifiée par l'action

<script type="text/javascript">
         function check(form) {
              if(form.userId.value==&#39;&#39;) {
                    alert("请输入用户帐号!");
                    form.userId.focus();
                    return false;
               }
               if(form.password.value==&#39;&#39;){
                    alert("请输入登录密码!");
                    form.password.focus();
                    return false;
                }
                return true;
         }
</script>
<form action="demo.asp act=login" method="post" onsubmit="return check(this)">
    用户帐号<input type=text name="userId" size="18" value="" ><br>
    登录密码<input type="password" name="password" size="19" value=""/>      
    <input type=submit name="submit1" value="登陆"> 
</form>

Résumé : Ce qui précède est l'intégralité du contenu de cet article. J'espère que cet article pourra vous aider à apprendre plusieurs formes de. soumission du formulaire.

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:
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