Comunidad de diseño web y desarrollo en internet online

Cambiar label de Checkbox al seleccionar

Citar            
MensajeEscrito el 09 Dic 2012 06:13 pm
Saludos Comunidad,

Estoy entrampado con un detalle, tal como dice el título. Encontré un código que hace lo que quiero por medio de la ID. Yo necesito que sea por medio de la Clase. La idea es que al estar desactivado el checkbox diga activar y al estar activado diga desactivar. Como digo, con la ID me funciona bien, pero a pesar de probar varias soluciones que encontré no me funca con la Clase. Dejo el código que funciona por la ID. ¿Cómo se podría cambiar para que en lugar de acceder a la ID acceda a la Clase?

Código Javascript :

// JS funcionando por ID
function cambiar(thecheckbox, thelabel) {
var checkboxvar = document.getElementById(thecheckbox);
var labelvar = document.getElementById(thelabel);
if (!checkboxvar.checked) {
labelvar.innerHTML = "activar";
}
else {
labelvar.innerHTML = "desactivar";
}
}
// HTML cambié el id por class que es lo que necesito!
<label class="label">activar</label>
<input type="checkbox" class="check" onclick="cambiar('check','label');">
Ojalá me puedan ayudar. Gracias de antemano.

:wink:

Por eareddhel

83 de clabLevel



Genero:Masculino  

msie
Citar            
MensajeEscrito el 10 Dic 2012 12:25 pm
Para acceder a la clase podes usar

Código Javascript :

var elementos = $('.miclase');

El problema es si tenés más de un elemento con esa clase...
En todo caso, hace esto, en el html

Código HTML :

<div class="contenedor_input">
<label class="label">activar</label>
// cambia el onclick
<input type="checkbox" class="check" onclick="cambiar(this);">
</div>

Y en el js

Código Javascript :

function cambiar(elinput) {
var parent = $(elinput).parent();
var label = $(parent).find('label');
if (!elinput.checked) {
label.innerHTML = "activar";
} else {
label.innerHTML = "desactivar";
}
}


Saludos!

PD: puede haber algún error por ahí, lo escribí así nomas...

Por SinSemilla

Claber

336 de clabLevel



Genero:Masculino  

i am that i am...

firefox
Citar            
MensajeEscrito el 12 Dic 2012 01:04 am
Gracias sin semilla. En efecto, la idea de ocupar Clase en lugar de Id es porque tengo varios checkbox a los que les deseo cambiar el texto del label. Si sólo sirve para uno entonces es lo mismo que usando la Id, cosa que como ya mencioné tengo funcionando. La idea de usar clases era reducir la cantidad de código que tendría que repetir por cada Id.

Por eareddhel

83 de clabLevel



Genero:Masculino  

msie
Citar            
MensajeEscrito el 12 Dic 2012 12:17 pm
Ehhhh....

Si, la respuesta para acceder a la clase es la primera parte de código que te escribí, y la solución para poder hacerlo con clases para varios elementos, es el resto del código...
No se si te diste cuenta, pero puse el label y el input dentro de un contenedor y edite el js...

Saludos!

Por SinSemilla

Claber

336 de clabLevel



Genero:Masculino  

i am that i am...

firefox

 

Cristalab BabyBlue v4 + V4 © 2011 Cristalab
Powered by ClabEngines v4, HTML5, love and ponies.