checkbox :checked cambiar el color background jQuery

publicado por: Anonymous

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.

solución

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");
    }
});
Respondido por: Anonymous

Leave a Reply

Your email address will not be published.