Zieleingabe nach Typ und Name (Selektor)

132

Ich muss einige Checkbox-Eingaben für einige, aber nicht alle Eingaben auf einer Seite in versteckte Eingaben ändern.

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

Der folgende Abfragecode wählt nur die Eingabe nach Typ aus, wodurch alle Kontrollkästchen in versteckte Eingaben geändert werden. Gibt es eine Möglichkeit, sowohl den Typ der Eingabe = "Kontrollkästchen" als auch den Namen = "ProductCode" als Selektor zu überprüfen, damit ich diese gezielt auswählen kann dass ich mich ändern will?

$("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
});

user357034
quelle

Antworten:

285

Sie möchten einen Selektor mit mehreren Attributen

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

oder

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

Es ist besser, eine CSS-Klasse zu verwenden, um diejenigen zu identifizieren, die Sie auswählen möchten. Viele moderne Browser implementieren jedoch die document.getElementsByClassNameMethode, mit der Elemente ausgewählt werden, und sind viel schneller als die Auswahl anhand des nameAttributs

Russ Cam
quelle
Beide arbeiteten für mich, aber ich benutzte die zweite Methode. THX, ich habe noch eine Frage, aber ich werde eine neue Frage stellen.
user357034
22

Sie können Attributselektoren folgendermaßen kombinieren:

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

so dass ein Element beide Bedingungen erfüllen muss. Natürlich können Sie dies für mehr als zwei verwenden. Tu es auch nicht [type=checkbox]. jQuery hat dafür einen Selektor, nämlich :checkboxdas Endergebnis ist:

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

Attributselektoren sind jedoch langsam, daher wird empfohlen, nach Möglichkeit ID- und Klassenselektoren zu verwenden. Sie können Ihr Markup ändern in:

<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">

So können Sie die viel schnellere Auswahl von:

$("input.ProductCode")...
Cletus
quelle
Natürlich funktioniert das auch, aber ich kann nur einer Person die richtige Antwort zuschreiben. :) Eine Sache ist, dass ich nicht nach Klassen zielen kann, weil ich keinen Zugriff auf Markup habe, es sei denn, ich füge eine Klasse hinzu und welchen Punkt würde das machen. Aber danke !!!
user357034
6
input[type='checkbox', name='ProductCode']

Das ist der CSS-Weg und ich bin fast sicher, dass es in jQuery funktionieren wird.

Dani
quelle