2010-12-03 7 views
0

J'essaie de remplacer ces deux nœuds de texte l'un par l'autre. Cela suppose d'être comme une vérification de correction. Ce que son supposé faire est de voir si l'entrée est correcte après que vous vous concentriez sur une autre entrée.Remplacer les nœuds de texte

C'est le 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); 
     } 
    } 

c'est le fichier css:

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


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

Donc, si vous pouvez me aider ce sera grand. S'il vous plaît pas de jquery. Merci

+0

Le fieldset et les deux divs ont besoin d'étiquettes de fin, avant même de commencer le script. – kennebec

Répondre

0

Je ne suis pas sûr de ce que vous essayez d'accomplir avec la fonction-dans-une-fonction. Ce qui suit fait quelque chose, pas sûr si c'est ce que vous voulez ou non:


<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> 
Questions connexes