entrée cible par type et nom (sélecteur)

J'ai besoin de changer certaines entrées de case à cocher en entrées cachées pour certaines mais pas toutes les entrées sur une page.

<input type="checkbox" name="ProductCode"value="396P4"> 
<input type="checkbox" name="ProductCode"value="401P4"> 
<input type="checkbox" name="ProductCode"value="F460129">

Le code jQuery ci-dessous sélectionne uniquement l'entrée par type, ce qui entraîne le changement de toutes les cases à cocher en entrées cachées Existe-t-il un moyen de vérifier à la fois le type d'input="checkbox" et name="ProductCode" comme sélecteur afin que je puisse cibler spécifiquement ceux que je veux changer?

$("input[type='checkbox']").each(function(){
var name = $(this).attr('name'); // grab name of original
var value = $(this).attr('value'); // grab value of original
var html = '<input type="hidden" name="'+name+'" value="'+value+'" />';
$(this).after(html).remove(); // add new, then remove original input
});

118
demandé sur user357034 2010-07-11 02:38:47

3 réponses

Vous voulez un plusieurs sélecteur d'attribut

$("input[type='checkbox'][name='ProductCode']").each(function(){ ...

Ou

$("input:checkbox[name='ProductCode']").each(function(){ ...

Il serait préférable d'utiliser une classe CSS pour identifier ceux que vous voulez sélectionner cependant car beaucoup de navigateurs modernes implémentent la méthode document.getElementsByClassName qui sera utilisée pour sélectionner des éléments et sera beaucoup plus rapide que la sélection par l'attribut name

249
répondu Russ Cam 2010-07-10 22:43:10

Vous pouvez combiner les sélecteurs d'attributs de cette façon:

$("[attr1=val][attr2=val]")...

, de Sorte qu'un élément doit satisfaire aux deux conditions. Bien sûr, vous pouvez l'utiliser pour plus de deux. Aussi, ne faites pas [type=checkbox]. jQuery a un sélecteur pour cela, à savoir :checkbox de sorte que le résultat final est:

$("input:checkbox[name=ProductCode]")...

Les sélecteurs D'attributs sont lents, donc l'approche recommandée est d'utiliser des sélecteurs D'ID et de classe si possible. Vous pouvez changer votre balisage en:

<input type="checkbox" class="ProductCode" name="ProductCode"value="396P4"> 
<input type="checkbox" class="ProductCode" name="ProductCode"value="401P4"> 
<input type="checkbox" class="ProductCode" name="ProductCode"value="F460129">

, vous Permettant d'utiliser le beaucoup plus vite sélecteur de:

$("input.ProductCode")...
21
répondu cletus 2010-07-10 22:41:13
input[type='checkbox', name='ProductCode']

C'est la façon CSS et je suis presque sûr que cela fonctionnera dans jQuery.

6
répondu Dani 2010-07-10 22:43:24