2010-12-03 12 views
0

私はこれらの2つのテキストノードをお互いに置き換えようとしています。それは訂正検証のようなものだと考えられます。その場合、別の入力にフォーカスした後に入力が正しいかどうかを確認することです。あなたは偉大になることを私を助けることができるのであればテキストノードを置換してください

.one { 
    color:#000; 
    position:absolute; 
    top:400px; 
} 


.two{ 
    color:#000; 
    font-family:Arial, Helvetica, sans-serif; 
    font-size:14px; 
    position: absolute; 
    top:400px; 
} 

これは、HTML

<body> 
<form action="" method="post" name="myform"> 
     <fieldset> 
      <legend>Lab Group Form</legend> 
       <label for="first_name">First Name:</label> 
       <br/> 
      <input id="first_name" type="text" name="first_name_text" value="" onblur="validatefirst()" /> 
        <br/><br/> 
      </fieldset> 
</form> 

<div class="one" id="one"/> 
<div class="two" id="two"/> 
</body> 



    function validatefirst() { 
     if (document.myform.first_name.value.length > 0) { 
      var one = document.createTextNode("Correct"); 
      var one_container = document.getElementById("one"); 

     } else { 
      var two = document.createTextNode("Incorrect."); 
      var two_container = document.getElementById("two"); 
      two_container.appendChild(two); 
     } 
    } 

が、これはCSSファイルです。 jqueryをしないでください。ありがとう

+0

フィールドセットと両方のdivには、スクリプトを開始する前に終了タグが必要です。 – kennebec

答えて

0

function-within-a-functionで何を達成しようとしているのかよく分かりません。あなたが望むかどうかわからない場合は、次のようにしてください:


<html> 
<head> 
<style> 
.one { 
    color:#000; 
    position:absolute; 
    top:200px; 
} 


.two{ 
    color:#000; 
    font-family:Arial, Helvetica, sans-serif; 
    font-size:14px; 
    position: absolute; 
    top:200px; 
} 
</style> 
</head> 
<body> 
<form action="" method="post" name="myform"> 
     <fieldset> 
      <legend>Lab Group Form</legend> 
       <label for="first_name">First Name:</label> 
       <br/> 
      <input id="first_name" type="text" name="first_name_text" onchange="validatefirst()" /> 
        <br/><br/> 
      </fieldset> 
</form> 

<div class="one" id="one"/> 
<div class="two" id="two"/> 
</body> 
<script> 
    function validatefirst() { 
     if (document.getElementById("first_name").value.length > 0) { 
      var one = document.createTextNode("Correct"); 
      var one_container = document.getElementById("one"); 
      one_container.appendChild(one); 
     } else { 
      var two = document.createTextNode("Incorrect."); 
      var two_container = document.getElementById("two"); 
      two_container.appendChild(two); 
     } 
    } 
</script> 
</body> 
</html> 
関連する問題