Javascript和HTML表單驗證檢查

Question

我想學習HTML和JavaScript。我創建了一個html表單，並使用javascript來驗證這些字段。我有一個isNaN檢查年齡字段，emial的正則檢查和所有字段的存在檢查。我目前正在輸出表單到地址欄，但這不起作用，因爲我收到錯誤。

<title> </title> 
<script type="text/javascript"> 

    function validate() 
    { 
     var errors = 0; 
     if (isNumeric(document.getElementById("age").value) == false) 
     { 
      errors++; 
     } 
     if (emailCheck(document.getElementById("email").value) == false) 
     { 
      errors++; 
     } 
     var inputBoxes = document.getElementsByTagName('input'); 
     for(var i= 0; i < inputBoxes.length; i++) 
     { 
      if(inputBoxes[i].type != 'text') continue; 
      if(presenceCheck(inputBoxes[i].value) == false) 
      { 
       errors++; 

      } 
     } 
     console.log(errors); 
     if(errors == 0) 
     { 
     window.location.assign("output.html#" + "%%" + "name" + "%%" + 
     document.getElementById("name").value + "%%" + "email" + "%%" + 
     document.getElementById("email").value + "%%" + "age" + "%%" + 
     document.getElementById("age").value + "%%" + "comments" + "%%" + 
     document.getElementById("comments").value); 
     } 
    } 
    function isNumeric(number) 
    { 
     return !isNaN(number) && number != null && number != ""; 
    } 
    function emailCheck(email) 
    { 
     var emailRegex = /\s+@\s+.\s+/; 
     return emailRegex.test(email); 
    } 
    function presenceCheck(data) 
    { 
     var regex = /\s+/; 
     return regex.test(data); 
    } 

</script> 

下面是這是剛剛在此刻incased身體以標籤的形式

<form id="frmA" name="frmA"> 
    <label name="frmName">Name:</label><br /> 
    <input form="frmA" type="text" name="frmName" id="name"/><br /> 
    <label name="frmEmail">E-Mail:</label><br /> 
    <input form="frmA" type="text" name="frmEmail" id="email"/><br /> 
    <label name="age">Age:</label><br /> 
    <input form="frmA" name="frmAge" id="age"/><br /> 
    <label name="frmComments">Comments:</label><br /> 
    <textarea form="frmA" cols="50" rows="10" id="comments"></textarea><br /> 
</form> 
    <button onClick="validate();">Submit</button> 

我知道，當不存在數據的檢查工作，然而，當在形式和我輸入數據點擊提交我仍然面臨着4個錯誤。 （有5個錯誤，沒有數據：3x存在檢查，1爲正則表達式，一個爲isNaN）

因此，我的問題是爲什麼我仍然收到錯誤，爲什麼我得不到輸出。

任何幫助將不勝感激。

附加：我還想輸入字段在出現錯誤時更改顏色。

Answer 1

你的正則表達式是錯誤的。你有/\s+@\s+.\s+/，它應該是/\w+@\w+\.\w+/。你沒有逃過這個點，\s匹配空格，而不是字符串。 \w匹配單詞。對於一個正確的電子郵件正則表達式，你需要的不僅僅是這些，而是​​爲了你的簡單情況下工作，這就足夠了。第二個正則表達式應該是/\w+/。