validation en javascript - supprimer l'erreur msg sur le focus

Question

je ne suis pas très bien versé avec javascript, alors s'il vous plaît ours avec moi.

J'ai un formulaire dans lequel je valide les contrôles avec javascript. l'erreur est affichée lorsque les champs sont vides via une div, mais quand je me concentre et que je tape quelque chose dans la zone de texte, la div devrait disparaître. mais l'erreur div ne le fait pas et même si je tape quelque chose de valide, il affiche toujours la div.

je voudrais savoir où vais-je pas avec ce script:

<script type="text/javascript"> 
var err = document.getElementById("errmsg"); 

function checkInput(inPut) { 

    if (inPut.getValue() == "") { 
      err.setStyle('display', 'block'); 
      err.setTextValue("Field cannot be empty!"); 
      inPut.focus(); 
      return false; 
    } 
    else { 
      return true; 
    } 

} 


function checkTextBox(textBox) 
{ 

    if (textBox.getValue() == "") { 
      err.setStyle('display', 'block'); 
      err.setTextValue("Field cannot be empty!"); 
      textBox.focus(); 
     return false; 
    }  
    else if (!checkValidity(textBox.getValue())) { 
       err.setStyle('display', 'block'); 
     err.setTextValue("Please enter a valid email address!"); 
     textBox.focus(); 
     return false; 
    } 
    else { 
     return true; 
    } 
} 

. . . 
<div id="errmsg" class="invalid" style="display:none;"></div> <br /> 

. . . 
<input type="text" tabindex="1" name="name" id="name" class="input_contact" onblur="checkInput(this);"/> <br /> 

. . . 
<input type="text" tabindex="2" name="email" id="email" class="input_contact" onblur="checkTextBox(this);"/> <br /> 

il est une forme dans l'application facebook, mais alors que les FBJS fonctionne, je suppose qu'il ya un problème avec mon javascript de base.

Answer 1

essayer cette

var err = document.getElementById("errmsg"); 

function checkInput(inPut) { 

    if (inPut.getValue() == "") { 
      err.setStyle('display', 'block'); 
      err.setTextValue("Field cannot be empty!"); 
      inPut.focus(); 
      return false; 
    } 
    else { 
      err.setStyle('display', 'none'); 
      err.setTextValue(""); 
      return true; 
    } 

} 


function checkTextBox(textBox) 
{ 

    if (textBox.getValue() == "") { 
      err.setStyle('display', 'block'); 
      err.setTextValue("Field cannot be empty!"); 
      textBox.focus(); 
     return false; 
    }  
    else if (!checkValidity(textBox.getValue())) { 
     err.setStyle('display', 'block'); 
     err.setTextValue("Please enter a valid email address!"); 
     textBox.focus(); 
     return false; 
    } 
    else { 
     err.setStyle('display', 'none'); 
     err.setTextValue(""); 
     return true; 
    } 
} 

Answer 2

Pour obtenir la div à disparaître lorsque vous quelque chose de type, au lieu de lorsque le champ est cochée, vous aurez également besoin onchange et/ou onfocus gestionnaires d'événements pour les champs:

<input type="text" tabindex="1" name="name" id="name" class="input_contact" 
    onblur="checkInput(this);" 
    onfocus="err.setStyle('display', 'none');" 
    onchange="err.setStyle('display', 'none');" 
/> 

Ils peuvent également être définis à l'intérieur de checkInput(), si vous le souhaitez.