événement pour les attributs requis dans jquery

Question

Je ne peux pas expliquer correctement celui-ci, alors voici une capture d'écran:

Comment capturer l'événement lorsque ce point fort rouge apparaît autour d'un champ e-mail sur firefox. Alors que je pourrais faire quelque chose. Le code ci-dessous est juste un code pseudo mélangé avec un code formel:

<script src="jq.js"></script> 
    <script> 
    $(function(){ 

     $('#btn_yo').click(function(){ 
      $('input').each(function(index){ 
       if($(this:required == 'true'){ 
        //do something 
       } 
      }); 
     }); 
    }); 
    </script> 
    <input type="text" name="name" id="name" required/> 
    <input type="email" name="mail" id="mail"/> 
    <input type="button" id="btn_yo" value="submit"/> 

l'email attribut accepte uniquement les attributs de messagerie, et quand vous entrez autre chose, son automatiquement mise en surbrillance avec une bordure rouge. Comment puis-je capturer cet événement afin que je puisse faire une action personnalisée au lieu de la surbrillance rouge qui est la valeur par défaut.

Answer 1

Je pense que probablement ce que vous voulez utiliser est blur, de sorte que lorsque l'utilisateur quitte un champ d'entrée donné, vous pouvez effectuer la validation de ce champ et le drapeau comme invalide si nécessaire. Par exemple:

$("input").blur(function(evt) { 
    if (this.required && this.value == "") { 
     alert(this.name + " is a required field!"); 
     $(this).addClass("error"); 
     this.focus(); 
    } 
    else { 
     $(this).removeClass("error"); 
    } 
}); 

Ce qui vous donne quelque chose comme ceci: http://jsfiddle.net/CJ5Zc/1/

Answer 2

$('#mail').focus(function(){ 

    alert('focused'); 
});