Question

i have this html code:

<p>
 <label for="email">E-mail</label>
 <input id="email" name="email" placeholder="ex: [e-mail]"/>
</p>        
<p>
<label for="email_alt">E-mail Alternativo</label>
<input id="email_alt" name="email_alt" />
</p>

and i want to validate if the emails match in running time.

i found the code below in one of the posts here in stackoverflow and i understand that #author_email and #author_confirm_email are the id’s of the inputs. And as far was i know .blur is to trigger the alert in running time. but i’m not understanding that “.email” that trigger the function. What can i use there considerating the code i have?

   $(".email").blur(function(){
  //check to two here.
  if ($("#author_email").val() != $("#author_confirm_email").val())
  {
    //do something
  }
});

Answer 1

If you want to check the fields at runtime (i.e. while the user is typing), you have to use the keyup event (this event is fired each time a user has pressed and released a key):

$("#email_alt").keyup(function(){
    if ($("#email").val() != $("#email_alt").val()) {
        // emails don't match
    }
});

Didn’t test this, but actually it should work like that.

You might want to add some further validation, e.g. prevent empty fields and assure valid email addresses (as GTSouza suggested).