表單字段驗證問題

我想突出顯示空的表單字段並提示最終用戶在提交表單之前填寫缺失的字段。表單字段驗證問題

目前，當我點擊提交按鈕，它突出顯示空的字段，但它繞過提示並反正提交表單。有沒有辦法確保用戶在提交表單之前先填寫表單？我還需要將以下功能組合在一起，因爲它們似乎是單獨運行的。

請參見下面的代碼片段：

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

表單字段驗證問題

回答

相關問題