重复检查表单数据而不提交（JavaScript，HTML，JQuery）

问题描述：

我试图提交一个HTML表单，只有当所有字段都不在Javascript代码中返回false时。重复检查表单数据而不提交（JavaScript，HTML，JQuery）

我的HTML看起来像这样，为了简单起见，我刚才不停的姓名和电子邮件

<form method="post" action="RegistrationServlet" class="iform" 
      onsubmit="return sendForm();"> 

    <ul><li><label for="YourName">*Your Name <span id="regNameErr"></span></label> 
    <input class="itext" type="text" name="YourName" id="YourName" /></li> 

    <li><br /><label for="YourEmail">*Your Email <span id="regEmailErr"></span></label> 
    <input class="itext" type="text" name="YourEmail" id="YourEmail" /></li> 

    <li><input type="submit" value="Submit" class="ibutton" name="SendaMessage" 
     id="SendaMessage" value="Send a Message!" readonly="readonly" /></li></ul></form>

的JavaScript看起来像这样，为简便起见，我只检查2个字段：

<script type="text/javascript" 
      src="http://ajax.googleapis.com/ajax/libs/jquery/1.8/jquery.min.js"></script> 
    <script type="text/javascript"> 
    window.sendForm = function() { 
      if (($("#YourName").val() == "") || ($("#YourName").val().length > 55)) { 
            $("#YourName").addClass("required"); 
            window.scroll(0, 190); 
            $("#regNameErr").text("required"); 
            return false; 
           } 
           if ($("#YourEmail").val() == "") { 
            $("#YourEmail").addClass("required"); 
            window.scroll(0, 190); 
            $("#regEmailErr").text("required"); 
            return false; 
           } 

           if (!isEmailValid($("#YourEmail").val())) { 
            $("#YourEmail").addClass("required"); 
            window.scroll(0, 190); 
            $("#regEmailErr").text("required"); 
            return false; 
           } 
           $("#SendaMessage").val("Please Wait..."); 
           return true; 
          }

为什么sendForm（）函数在提交之前不会被重复调用以检查所有字段是否正确。有任何想法吗？

另外我明白，我可以在2天后添加赏金，但我没有在编辑器上看到任何按钮。

你能帮忙吗？

所以你说，一旦你提交它不断尝试提交一遍又一遍？ – epascarello

否如果他们提交的字段不正确，则应该重复，直到所有字段重新更正并提交。谢谢 – Alex

为了澄清，你是否在寻找sendForm（）函数来重复运行？此外，源代码中缺少isEmailValid（...）函数。这是打算？我问，因为如果它也从你的代码中丢失，那么对该函数的调用将失败并且表单将被提交。 –

答

sendForm每次提交只被调用一次 - 这是如何工作的，没有理由多次调用它。

如果您希望在提交时检查所有字段 - 每次检查后您都不应该使用return。相反，你应该推迟这一行动，直到所有字段都得到验证，并引入一些标志来记住结果：

function() { 
    var formValid = true; 
    if (($("#YourName").val() == "") || ($("#YourName").val().length > 55)) { 
     ... 
     formValid = false; 
    } 
    if ($("#YourEmail").val() == "") { 
     ... 
     formValid = false; 
    } 

    if (!isEmailValid($("#YourEmail").val())) { 
     ... 
     formValid = false; 
    } 

    if (!formValid) { 
     return false; 
    } 

    $("#SendaMessage").val("Please Wait..."); 
    return true; 
}

附注。你有没有考虑过这个jQuery验证插件？可以为您节省一些实施和维护工作。

这就是f @辉煌。我会尝试一下你有没有jQuery的例子？纯真棒 – Alex

@Alex，谷歌提供了很多选择。这是[第一]（http://jqueryvalidation.org/） – Andrei

重复检查表单数据而不提交（JavaScript，HTML，JQuery）

相关推荐