entrada de destino por tipo y nombre (selector)

132

Necesito cambiar algunas entradas de casillas de verificación a entradas ocultas para algunas pero no todas las entradas en una página.

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

El código jquery a continuación solo selecciona la entrada por tipo, lo que hace que todas las casillas de verificación cambien a entradas ocultas. ¿Hay alguna manera de verificar tanto el tipo de entrada = "casilla de verificación" como el nombre = "Código de producto" como el selector, de modo que pueda apuntar específicamente a esos que quiero cambiar?

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

jquery

— usuario357034
fuente

285

Desea un selector de atributos múltiples

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

o

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

Sin embargo, sería mejor usar una clase CSS para identificar las que desea seleccionar, ya que muchos de los navegadores modernos implementan el document.getElementsByClassNamemétodo que se utilizará para seleccionar elementos y será mucho más rápido que seleccionar por el nameatributo

— Russ Cam
fuente

Ambos funcionaron para mí pero utilicé el segundo método. THX, tengo otra pregunta pero haré una nueva pregunta.

— user357034

22

Puede combinar selectores de atributos de esta manera:

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

para que un elemento tenga que satisfacer ambas condiciones. Por supuesto, puedes usar esto para más de dos. Además, no lo hagas [type=checkbox]. jQuery tiene un selector para eso, es decir, :checkboxel resultado final es:

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

Sin embargo, los selectores de atributos son lentos, por lo que el enfoque recomendado es utilizar selectores de ID y clase cuando sea posible. Puede cambiar su marcado a:

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

permitiéndole usar el selector mucho más rápido de:

$("input.ProductCode")...

— cletus
fuente

Obviamente, esto también funciona, pero solo puedo dar crédito a una persona por la respuesta correcta. :) Una cosa pensada es que no puedo apuntar por clase porque no tengo acceso al marcado a menos que agregue una clase y qué punto haría eso. Pero gracias !!!

— user357034

6

input[type='checkbox', name='ProductCode']

Esa es la forma CSS y estoy casi seguro de que funcionará en jQuery.

— Dani
fuente