jQuery - validation d'entrée simple - "vide" et "non vide"

Question

J'ai une entrée que je veux valider:

<input type="text" id="input" /> 

Et voici la JS:

 jQuery("#input").live('change', function() { 

      if("#input:not(:empty)") { 
       alert('not empty'); 
      } 

      else if("#input:empty") { 
       alert('empty'); 
      } 
     }); 

Même lorsque la " #input "est vide il n'y a aucun moyen d'afficher l'alerte avec un message" vide ". Donc, fondamentalement, peu importe ce que je fais, seule la première affirmation est vraie et la seconde est fausse, toujours.

Qu'est-ce qui ne va pas?

Answer 1

JQuery's :empty selector sélectionne tous les éléments de la page qui sont vides dans le sens où ils ont aucun élément enfant, y compris les noeuds texte, pas toutes les entrées qui ont aucun texte en eux.

Jquery: How to check if an input element has not been filled in.

Voici le code volé le fil au-dessus:

$('#apply-form input').blur(function()   //whenever you click off an input element 
{     
    if(!$(this).val()) {      //if it is blank. 
     alert('empty');  
    } 
}); 

Cela fonctionne parce qu'une chaîne vide en JavaScript est une « valeur falsy », ce qui signifie, fondamentalement, si vous essayez d'utiliser comme valeur booléenne, il sera toujours évalué à false. Si vous le souhaitez, vous pouvez modifier la condition à $(this).val() === '' pour plus de clarté. : D

Answer 2

Vous pouvez le faire

$("#input").blur(function(){ 
    if($(this).val() == ''){ 
     alert('empty'); 
    } 
}); 

http://jsfiddle.net/jasongennaro/Y5P9k/1/

Lorsque l'entrée a perdu focus qui est .blur(), puis vérifiez la valeur de la #input.

S'il est vide == '', déclenchez l'alerte.

Answer 3

jQuery("#input").live('change', function() { 
     // since we check more than once against the value, place it in a var. 
     var inputvalue = $("#input").attr("value"); 

     // if it's value **IS NOT** "" 
     if(inputvalue !== "") { 
      jQuery(this).css('outline', 'solid 1px red'); 
     } 

     // else if it's value **IS** "" 
     else if(inputvalue === "") { 
      alert('empty'); 
     } 

    }); 

Answer 4

En fait, il y a une façon plus simple de ce faire, il suffit:

if ($("#input").is('empty')) { 
console.log('empty'); 
} else { 
console.log('not empty'); 
}