onChangeイベントが発生したときにclear（）関数が呼び出されないのはなぜですか？

Javascriptフォームの検証に関する練習を完了しています。私のコードでは、フォーム名、フォーム、検証メッセージという3つのカラムを持つテーブルがあります。フォームの検証中にエラーが発生すると、メッセージが3番目の列に表示されます。フォーム要素が変更されると、エラーメッセージは消えますが消えます。 clear（）関数が全く呼び出されていないようです。誰かが私を助けてくれますか - ありがとう！onChangeイベントが発生したときにclear（）関数が呼び出されないのはなぜですか？

<html> 
<head> 
<title>Validation</title> 
<script type="text/javascript"> 
    function clear() 
    { 
     for(var i in document.getElementsByName("error")) 
     { 
      document.getElementsByName("error")[i].innerHTML = ""; 
     } 
    } 


    function validate() 
    { 
     if(document.Form.Name.value.length < 1) 
     { 
      document.getElementsByName("error")[0].innerHTML = "Please enter your full name." 
      return false; 
     } 

     if(document.Form.Address.value.length<3) 
     { 
      document.getElementsByName("error")[1].innerHTML = "Please enter full address." 
      return false; 
     } 

     if(document.Form.Phone.value.length <6) 
     { 
      document.getElementsByName("error")[2].innerHTML = "Please enter a phone number." 
      return false; 
     } 

     if(document.Form.Email.value.length <5 || "@".search(document.Form.Email.value)==-1) 
     { 
      document.getElementsByName("error")[3].innerHTML = "Please enter a valid e-mail address"; 
      return false; 
     } 

    } 
</script> 
</head> 
<body> 
<h1>Validation</h1> 
<p>Enter the following information. When you press the Submit button, the data you entered will be validated.</p> 
<form name="Form" onSubmit="return validate()"> 
<table> 
<tr> 
    <td>Name</td> 
    <td><input type="text" name="Name" size="20" onchange="clear()" class="Form"></td> 
    <td><div name="error"></div></td> 
</tr> 
<tr> 
    <td>Address</td> 
    <td><textarea rows="5" columns="20" class="Form" onchange="clear()" name="Address"></textarea></td> 
    <td><div name="error"></div></td> 
</tr> 
<tr> 
    <td>Phone</td> 
    <td><input type="text" name="Phone" onchange="clear()" size="11" class="Form"></td> 
    <td><div name="error"></div></td> 
</tr> 
<tr> 
    <td>E-mail</td> 
    <td><input type="text" name="Email" onchange="clear()" size="20" class="Form"></td> 
    <td><div name="error"></div></td> 
</tr> 
</table> 
<input type="submit" value="Submit" > 
<input type="button" value="Clear" onClick="clear();"> 
</form> 
</body> 
</html>

出典

2012-05-10 W.K.S

を試してみてください。組み込み関数と名前の競合があるようです。 –

何か他のもの（例えば "clearErrors"）にクリアする方法の名前を変更してください。この

<html> 
    <head> 
<title>Validation</title> 

</head> 
<body> 
<h1>Validation</h1> 
<p>Enter the following information. When you press the Submit button, the data you entered will be validated.</p> 
<form name="Form" onSubmit="return validate()"> 
<table> 
<tr> 
    <td>Name</td> 
    <td><input type="text" name="Name" size="20" onkeypress="return clearErrors();" class="Form"></td> 
    <td><div name="error"></div></td> 
</tr> 
<tr> 
    <td>Address</td> 
    <td><textarea rows="5" columns="20" class="Form" onkeypress="return clearErrors();" name="Address"></textarea></td> 
    <td><div name="error"></div></td> 
</tr> 
<tr> 
    <td>Phone</td> 
    <td><input type="text" name="Phone" onkeypress="return clearErrors();" size="11" class="Form"></td> 
    <td><div name="error"></div></td> 
</tr> 
<tr> 
    <td>E-mail</td> 
    <td><input type="text" name="Email" onkeypress="return clearErrors();" size="20" class="Form"></td> 
    <td><div name="error"></div></td> 
</tr> 
</table> 
<input type="submit" value="Submit" > 
<input type="button" value="Clear" onClick="return clearErrors();"> 
</form> 
<script type="text/javascript"> 
    function clearErrors() 
     { 

      var arr = new Array(); 
      arr = document.getElementsByName('error'); 
      for (var i = 0; i < arr.length; i++) { 
       document.getElementsByName('error')[i].innerHTML = ""; 

      }  
     return true; 
    } 


    function validate() 
    { 
     if(document.Form.Name.value.length < 1) 
     { 
      document.getElementsByName("error")[0].innerHTML = "Please enter your full name." 
      return false; 
     } 

     if(document.Form.Address.value.length<3) 
     { 
      document.getElementsByName("error")[1].innerHTML = "Please enter full address." 
      return false; 
     } 

     if(document.Form.Phone.value.length <6) 
     { 
      document.getElementsByName("error")[2].innerHTML = "Please enter a phone number." 
      return false; 
     } 

     if(document.Form.Email.value.length <5 || "@".search(document.Form.Email.value)==-1) 
     { 
      document.getElementsByName("error")[3].innerHTML = "Please enter a valid e-mail address"; 
      return false; 
     } 

    } 
</script> 
</body> 
</html>

出典

2012-05-10 10:31:36 coolguy

名前が「clear」という名前と競合しています – coolguy

onChangeイベントが発生したときにclear（）関数が呼び出されないのはなぜですか？

答えて

関連する問題