web-dev-qa-db-fra.com

Comment sélectionner des entrées vides (value = "") à l'aide de jQuery

Comment puis-je vérifier les valeurs vides des champs d'entrée (required) dans une section, puis leur ajouter une classe lors d'un événement, à l'aide de jQuery? Jusqu'à présent, j'ai essayé:

jQuery("#sender_container input.required").val("").addClass("error");

Mais cela sembleDÉFINIRla valeur, plutôt que de la vérifier. Des idées?

javascriptjqueryjquery-selectors
46
Richard Harris
jQuery("#sender_container input.required").filter(function() {
    return !this.value;
}).addClass("error");​

Pourquoi vous devez utiliser filter et non [value=""], vous pouvez voir dans this DEMO

La raison en est que: les sélecteurs d'attributs vérifient l'état initial de l'élément, pas l'état actuel. (notez que vous pouvez changer l'état "initial" avec la fonction attr, mais c'est une mauvaise pratique, vous devriez toujours utiliser prop)

Donc, si vous modifiez la valeur d'entrée, la valeur actuelle n'aura pas d'effet sur le sélecteur d'attribut. pas sage ... :)

Remarques:

  • .val()renvoie la valeur de l'élément de formulaire et rompt la chaîne jQuery, $('selector').val().addClass('foo')Error, la valeur renvoyée est une chaîne \ nombre

  • .val(valueToSet)définit la valeur de l'élément de formulaire et ne rompt pas la chaîne jQuery.
    $('selector').val("some value").addClass('foo') - Valid, la valeur renvoyée est un jQuery

86
gdoron
$('input:text[value=]','#sender_container').addClass('error');

DEMO

10
h0mayun
$('#sender_container input.required[value=""]').addClass('error')
3
Parv Sharma
jQuery('#sender_container input.required[value=""]').addClass("error");

Vous pouvez essayer ceci:

$('input:not([value!=""])').addClass('error');

DÉMO

Remarque: Cette réponse ne doit pas être utilisée, et la seule raison pour laquelle elle n'a pas été supprimée est son apprentissage.

1
thecodeparadox

Si vous devez uniquement sélectionner en fonction de la valeur d'attribut initiale de l'entrée, procédez comme suit:

var elements = $('#sender_container input.required[value=""]')

Mais sachez que cela ne fonctionnera pas si l'attribut value n'est pas présent. Cela ne fonctionnera pas non plus pour la valeur d'entrée actuelle si elle a été modifiée par l'utilisateur ou le script.

Si vous souhaitez obtenir la valeur d'entrée actuelle, vous pouvez utiliser jquery ' filter function:

var elements = $('#sender_container input.required').filter(function() {
  return this.value === '';

  // alternatively for "no value":
  // return !this.value;
})

Après avoir sélectionné les éléments jquery, vous pouvez ajouter votre classe:

elements.addClass('error');
0
schmijos

Pour ceux input.required ne fonctionne pas, écrivez comme suit:

jQuery('#sender_container input[required]').val("").addClass("error");
0
Masood Aslami

obtenir tous les champs inspectés cela pourrait aider.

$('#sender_container [required]').each(function(index)
{
       if (!($(this).val())) $(this).addClass('error');
}

});
0
rmil
$field = $("#sender_container input.required");
if( ! $field.val())
{
    $field.addClass("error");
}

cette façon simple peut fonctionner. 

0
Nils