0

https://jsfiddle.net/Chusi/w5gwdjac/5/

Como marcar el fondo a negro del div cuando el radio esté en checked , y solo un div a la vez pueda estar en negro JQuery.

El problema que tengo ahora es que los div se marcan con color negro, pero cuando marco uno al marcar el siguiente, el primero no vuelve al color inicial sino que se queda marcado con color negro.

2
  • El enlace al JSFiddle no funciona. Cambialo, y debido a eso, deberías añadir tu código directamente aquí. el 24 ene. 2017 a las 11:14
  • hecho @cnbandicoot , Gracias el 24 ene. 2017 a las 11:35

1 respuesta 1

1

Aquí tienes el código.

Simplemente cuando hagas un on('change') tienes que devolver todos los box a su estado original y al seleccionado darle los estilos que quieras darles.

https://jsfiddle.net/w5gwdjac/10/

añado: también puedes crear clases como "radioSelected" y así puedes tener el código aún más limpio y más "readable"

CSS:

.box.selected {
    background-color: #000;
}
.box.selected p {
  color: #fff;
}

Jquery:

$input.each(function() {
    if ($(this).prop("checked")) {
        $(this).parent(".box").addClass("selected");
    }
});
$input.on('change', function() {
    if ($(this).prop("checked")) {
        $input.each(function() {
            $(this).parent(".box").removeClass("selected");
        });
        $(this).parent(".box").addClass("selected");
    }
});
2
  • Funciona! Creía que con tu recomendación de las clases no funcionaba, pero sí, ya funciona!! :) Gracias el 24 ene. 2017 a las 15:00
  • De nada! Para eso estamos cuando nos proporcionan código. Y las clases por supuesto, cuando añadas o quitas una clase, el navegador lo renderiza si esta no tiene los atributos dados, o si es más especifica re-emplazando ya los existentes.
    – Zander
    el 24 ene. 2017 a las 15:06

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.