CODEWITHSUNDEEP
javascriptjqueryhtml
Jason Howard
Jason Howard

Reputation: 1586

focusout() is not functioning using jQuery

I'm attempting to evaluate the length of the content within an input field. If the length of the content is 0, I want to apply some CSS styles.

When I remove the if statement, this function works on focus out. Can you see where I've gone wrong with my syntax?

$( "input" ).focusout(function() {                   
     var n = $( "input" ).length;                   
     if (n == 0) {                   
         $( '.enteremail' ).css( "transform", "translateY(0px)");                   
     }                   
});

Upvotes: 2

Views: 94

Answers (2)

Zakaria Acharki
Zakaria Acharki

Reputation: 67505

$( "input" ).length will return the number of inputs in the current docuent.

You need first to use the this keyword to target the current input that is losing the focus, then use the jQuery method .val() to return the value of the input before checking the length, like :

 $("input").focusout(function() {
      if ( $(this).val().length ) {                   
          $( '.enteremail' ).css( "transform", "translateY(0px)");                   
      }                   
 });

Upvotes: 3

kapantzak
kapantzak

Reputation: 11750

You must check the input's value:

$('input').focusout(function() {
     // Check the value of the affected ("this") input
     var n = $(this).val().length;
     if (n === 0) {                   
         $('.enteremail').css('transform', 'translateY(0px)');                   
     }                   
});

not the number of input fields in the document

Upvotes: 2

Related Questions