JS表單驗證功能不起作用

我有一個JS函數的這種形式來驗證沒有空白字段，但它不起作用。
JS表單驗證功能不起作用

<head> 
    <script language='javascript'> 
     function verifyForm(){ 
     var msg=''; 
     if(document.getElementById('field1').value==''){msg+='Field 1 \n';} 
     if(document.getElementById('field2').value==''){msg+='Field 2 \n';} 
     if(msg!=''){ 
      alert('The following entries are empty:\n\n'+msg); 
      return false 
     }else{ 
      return true } 
     } 
    </script> 
</head> 

<body> 
    <form name="frmRequest2" id="frmRequest2" action="<? echo $submitURL2; ?>" method="post" onsubmit='return verifyForm();'> 
    Please answer all questions and enter "NONE" where appropriate. 

    <table> 
    <tbody> 
     <tr> 
     <th>List any items you already have</th> 
     <th>List any items you need to get</th> 
     </tr> 
     <tr> 
     <td><textarea name="field1" id="field1" rows="2" cols="39"> <? echo $field1; ?> </textarea></td> 
     <td><textarea name="field2" id="field2" rows="2" cols="39"> <? echo $field2; ?> </textarea></td> 
     </tr> 

     <tr> 
     <td colspan="4" align="center" valign="top" style="border-width: 0px 0px 0px 0px;"> <br /> 
     <input name="submit" value="Submit Data" type="submit"/> </td> 
     </tr>  
    </tbody> 
    </table> 
    </form> 
</body>

來源

2010-07-09 ChuckO

這是什麼，「它不起作用」是什麼意思？ – Pointy 2010-07-09 14:20:19

即使字段爲空，表單也會被提交。 – ChuckO 2010-07-09 14:37:53

你有沒有得到警報？ – Pointy 2010-07-09 14:40:53

你的if子句後面有多餘的大括號（}）。

編輯補充：下面的代碼按預期工作，而忽略了任何領域的前/後空格：

<html> 

<head> 
    <script language='javascript'> 
     function verifyForm(){ 
     var msg=''; 
     if(document.getElementById('field1').value.replace(/\s+$|^\s+/, '') == '') {msg+='Field 1 \n';} 
     if(document.getElementById('field2').value.replace(/\s+$|^\s+/, '') == '') {msg+='Field 2 \n';} 
     if(msg!=''){ 
      alert('The following entries are empty:\n\n'+msg); 
      return false; 
     }else{ 
      return true; 
     } 
     } 
    </script> 
</head> 

<body> 
    <form name="frmRequest2" id="frmRequest2" action="" method="post" onsubmit='return verifyForm();'> 
    Please answer all questions and enter "NONE" where appropriate. 

    <table> 
     <tbody> 
     <tr> 
     <th>List any items you already have</th> 
     <th>List any items you need to get</th> 
     </tr> 
     <tr> 
     <td><textarea name="field1" id="field1" rows="2" cols="39"></textarea></td> 
     <td><textarea name="field2" id="field2" rows="2" cols="39"></textarea></td> 
     </tr> 

     <tr> 
     <td colspan="4" align="center" valign="top" style="border-width: 0px 0px 0px 0px;"> 
      <input name="submit" value="Submit Data" type="submit"/> 
     </td> 
     </tr> 
    </tbody> 
    </table> 

</form> 
</body> 

</html>

來源

2010-07-09 14:27:00

那也是:) – 2010-07-09 14:29:59

我刪除了額外的花括號。它仍然不起作用。 – ChuckO 2010-07-09 14:38:56

當我拿這段代碼並刪除大括號，並修正小標記錯別字時，它工作正常。使用Firebug或其他東西來確保你沒有其他Javascript錯誤。 – Pointy 2010-07-09 14:46:17

你對你關閉「[/頭]」標籤，你不收你的「【組成】」標籤缺少「>」。這可能會導致問題。

來源

2010-07-09 14:22:30

原始代碼中包含「>」和「」。在這個例子中我把它們弄丟了。 – ChuckO 2010-07-09 14:41:30

你必須在每個默認值中的每個側面的空間。 "" != " "

來源

2010-07-09 14:29:59 Quentin

多餘的空格不在原始代碼中。爲了清楚起見，我只將它添加到示例中。 – ChuckO 2010-07-09 14:40:20

因此提供了一個很好的例子，說明爲什麼你應該提供你的代碼，而不是僅僅是你的代碼。 – Quentin 2010-07-09 19:06:57

作爲一般規則，我喜歡修剪輸入空間。是否將if子句更改爲

document.getElementById('field1').value == '' to 
document.getElementById('field1').value.trim() == ''

幫助所有？

此外，爲了重申一下大衛建議，你原來的代碼看起來像

<textarea name="field1" id="field1" rows="2" cols="39"><? echo $field1; ?></textarea>

，而不是

<textarea name="field1" id="field1" rows="2" cols="39"> <? echo $field1; ?> </textarea>

通知的空間？

來源

2010-07-09 15:15:19 Haydar

JS表單驗證功能不起作用

回答

相關問題