表单字段验证问题

我想突出显示空的表单字段并提示最终用户在提交表单之前填写缺失的字段。表单字段验证问题

目前，当我点击提交按钮，它突出显示空的字段，但它绕过提示并反正提交表单。有没有办法确保用户在提交表单之前先填写表单？我还需要将以下功能组合在一起，因为它们似乎是单独运行的。

请参见下面的代码片段：

//JS 

**<script> 

     function myFunction() { 
      document.getElementById("onlinepensionform_submit.asp").submit(); 
     } 
</script>** 

**<script> 

    function formcheck() { 
     var fields = $(".ff-item-required") 
     .find("select, textarea, input").serializeArray(); 

      $.each(fields, function(i, field) { 
     if (!field.value) 
     alert(field.name + ' is required'); 
    }); 
    console.log(fields); 
} 

</script>** 

// HTML 

<form name="onlinepensionform" action="onlinepensionform_submit.asp" id="onlinepensionform_submit.asp" method="post"> 

<TR class="ff-item-required"><TD width="253"><label for="FinancialInstitutionName">Financial Institution: </label> </TD><TD width="672"><span id="sprytextfield1"> 
     <input name="FinancialInstitutionName" type="text" id="FinancialInstitutionName" value="" /> 

       <TR class="ff-item-required"><TD> <label for="AccountName">Account name: </label></TD><TD> 
     <input name="AccountName" type="text" id="AccountName" value="" /> 
        </TD></TR> 
            <TR class="ff-item-required"><TD> <label for="BsbNumber">BSB Number: </label></TD><TD> 
         <input name="BsbNumber" type="text" id="BsbNumber" value="" /> 
        </TD></TR> 
       <TR class="ff-item-required"><TD> <label for="AccountNumber">Account Number: </label></TD><TD> 
     <input name="AccountNumber" type="text" id="AccountNumber" value="" /> 

        <BR /><BR /> 

         </TD></TR> 


<input type="button" onclick="myFunction(); formcheck(); return false" value="Submit form"> 

</form>

来源

2017-01-18 Pro86

首先调用formcheck（）函数，那么如果每一件事情是确定的，然后调用myFunction的（）。 –

做什么@FrankerZ说，如果你想留在当前的代码。

或者：您可以使用HTML5的需要标签，而不是担心。它会是这个样子：

<input type="text" name="firstName" required>

来源

2017-01-18 00:53:25

表单字段验证问题

回答

相关问题