entre Desarrolladores

Recibe ayuda de expertos

Registrate y pregunta

Es gratis y fácil

Recibe respuestas

Respuestas, votos y comentarios

Vota y selecciona respuestas

Recibe puntos, vota y da la solución

Pregunta

2votos

Como seleccionar varios ids en javascript?

Hola, he creado un pequeño script para editar el estilo de los checkbox, pero sin pongo 2 checkbox en la misma pagina solo me funciona con el primero. Como hago para que funcionen mas de uno?

Aqui esta el ejemplo: http://jsfiddle.net/DH46q/

3 Respuestas

1voto

He modificado un poco el propio JSFiddle que habías hecho para mostrar lo que se comenta en otras respuestas. Espero que te sirva para algo:

Ejemplo en JSFiddle

Un saludo.

0voto

Jaumesv comentado

Gracias por tu codigo! Me ha servido de mucha ayuda, excepto la parte final donde al hacer click en el primero me cambiaba el segundo, pero lo he modificado obteniendo el mismo elemento al hacer click y obteniendo su elemento siguiente que era el checkbox. Dejo el codigo solucionado por si alguien lo quiere usar: http://jsfiddle.net/LGA4d/2/

0voto

humberto_garcia_caba comentado

Ok. Me alegro que te haya servido de algo.

Un saludo.

2votos

Hola, los ids deben ser únicos, no puedes usar el mismo para dos elementos. Deberías usar una clase:

<input type="checkbox" id="on-off" class="on-off" name="private"/>
<input type="checkbox" id="on-off" class="on-off" name="custom"/>

Y usar la función getElementsByClassName en lugar getElementById.

0voto

Jaumesv comentado

Ya pero subtituyendo getElementById por getElementsByClassName me quedo igual porque me da una lista de los inputs. Le he añadido [0] al final pero solo funciona el primero y si le añado [1] funciona el segundo

0voto

Leonardo-Tadei comentado

Hola Jaumesv,

lo que dice @angel-luis-aparicio-gomez-sevilla es correcto: es HTML inválido que más de un elemento tenga el mismo ID.

La solución también es correcta: le podés poner una clase a los checkbox y con getElementsByClassName() obtenés una lista con todos ellos. Luego recorrés la lista y le editás el estilo a cada uno de la forma que te haga falta.

Si esta no es la solución a tu problema, entonces explicá mejor en qué consiste el "cambio de estilo" que mencionás.

Saludos!

1voto

mrczrt Puntos6940

Hola que tal, puedes usar:

var check = document.querySelectorAll('[id=on-off]');

Aunque es correcto que los ID deben ser únicos también pueden ser tratados como atributos en una búsqueda, toma en cuenta que la compatibilidad que es desde IE8 , FF3, Chrome4 y todos los demás navegaderos en todas sus versiones.

Saludos.

0voto

mrczrt comentado

A el codigo queda así ya integrandole el FOR :

var check = document.querySelectorAll('[id=on-off]');
for(var i=check.length;i--;){
check[i].style.display="none";
var cssiconon = document.createElement("div");
var x = check[i].checked;
if(x == false){
var t = document.createTextNode("OFF");
cssiconon.className='offcheck'
}else{
var t = document.createTextNode("ON");
cssiconon.className='oncheck'
}
cssiconon.appendChild(t);
document.body.insertBefore(cssiconon,check);
cssiconon.onclick = function(){
var x = check[i].checked;
if(x == false){
check[i].setAttribute("checked", "checked");
cssiconon.innerHTML='ON';
cssiconon.className='oncheck'
}
if(x == true){
check[i].removeAttribute("checked");
cssiconon.innerHTML='OFF';
cssiconon.className='offcheck'
}
}
}

Por favor, accede o regístrate para responder a esta pregunta.

Otras Preguntas y Respuestas


...

Bienvenido a entre Desarrolladores, donde puedes realizar preguntas y recibir respuestas de otros miembros de la comunidad.

Conecta