Hacer Pregunta

Conecta

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?

preguntó
Web
2112 Vistas
3 Respuestas
solucionada

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/

por Jaumesv (1.970 puntos) en Web

3 Respuestas

1voto

humberto_garcia_caba Puntos4510

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.

por humberto_garcia_caba (4.510 puntos)
seleccionada por

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/

por Jaumesv (1.970 puntos)

0voto

humberto_garcia_caba comentado

Ok. Me alegro que te haya servido de algo.

Un saludo.

por humberto_garcia_caba (4.510 puntos)

2votos

angel-luis-aparicio- Puntos180

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.

por angel-luis-aparicio- (180 puntos)

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

por Jaumesv (1.970 puntos)

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!

por Leonardo-Tadei (227.320 puntos)

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.

por mrczrt (6.940 puntos)

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 mrczrt (6.940 puntos)

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

Otras Preguntas y Respuestas


Sin Respuesta

Preguntas relacionadas

Actividad Reciente

Ultimas Preguntas

Preguntas relacionadas

Usuarios Top

Todos los Usuarios Usuarios Nuevos

Etiquetas

Categorías

...

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

Etiquetas

Categorías

Conecta