Catch marcado evento de cambio de una casilla de verificación

¿Cómo puedo marcar marcar/desmarcar evento de <input type="checkbox" /> con jQuery?Catch marcado evento de cambio de una casilla de verificación

Fuente

2009-09-21 omg

Si está utilizando una relativamente nueva versión de jQuery, me gustaría utilizar el .on ('cambio', function() {...}) como se menciona en La respuesta de @ Daniel de Leon a continuación. Una ventaja, el oyente de eventos "activado" se vinculará a html generado dinámicamente. – BLang

127

<input type="checkbox" id="something" /> 

$("#something").click(function(){ 
    if($(this).is(':checked')) alert("checked"); 
});

Editar: Hacer esto no cogerá cuando la casilla de verificación cambia por otras razones que un clic, como usar el teclado. Para evitar este problema, escuche change en lugar de click.

Para marcando/desmarcando mediante programación, echar un vistazo a Why isn't my checkbox change event triggered?

Fuente

2009-09-21 15:50:11 marcgg

document.getElementById ('something'). Checked works, why $ ('# something'). Checked ¿no trabajo? – omg

A su código le falta un párrafo, y realmente debería usar la forma jQuery de obtener el estado de verificación. –

Porque $ ('# algo') devuelve un objeto jQuery no un ElementNode –

utilizar el evento clic para una mejor compatibilidad con MSIE

$(document).ready(function() { 
    $("input[type=checkbox]").click(function() { 
     alert("state changed"); 
    }); 
});

Fuente

2009-09-21 15:48:23

¿Cómo juzgar si está marcado o no? – omg

Necesito saber si un clic significa marcar o desmarcarlo. – omg

puede usar $ (this) .is (': checked') para probar el estado del ítem que acaba de hacer clic –

Utilice el :checked para determinar el estado de la casilla de verificación:

$('input[type=checkbox]').click(function() { 
    if($(this).is(':checked')) { 
     ... 
    } else { 
     ... 
    } 
});

Fuente

2009-09-21 15:51:10 karim79

necesita otro paréntesis en su condición ... if ($ (esto) ... –

@Ty W - gracias, reparado – karim79

-2

$(document).ready(function(){ 
    checkUncheckAll("#select_all","[name='check_boxes[]']"); 
}); 

var NUM_BOXES = 10; 
// last checkbox the user clicked 
var last = -1; 
function check(event) { 
    // in IE, the event object is a property of the window object 
    // in Mozilla, event object is passed to event handlers as a parameter 
    event = event || window.event; 

    var num = parseInt(/box\[(\d+)\]/.exec(this.name)[1]); 
    if (event.shiftKey && last != -1) { 
    var di = num > last ? 1 : -1; 
    for (var i = last; i != num; i += di) 
     document.forms.boxes['box[' + i + ']'].checked = true; 
    } 
    last = num; 
} 
function init() { 
    for (var i = 0; i < NUM_BOXES; i++) 
    document.forms.boxes['box[' + i + ']'].onclick = check; 
}

HTML:

<body onload="init()"> 
    <form name="boxes"> 
    <input name="box[0]" type="checkbox"> 
    <input name="box[1]" type="checkbox"> 
    <input name="box[2]" type="checkbox"> 
    <input name="box[3]" type="checkbox"> 
    <input name="box[4]" type="checkbox"> 
    <input name="box[5]" type="checkbox"> 
    <input name="box[6]" type="checkbox"> 
    <input name="box[7]" type="checkbox"> 
    <input name="box[8]" type="checkbox"> 
    <input name="box[9]" type="checkbox"> 
    </form> 
</body>

Fuente

2009-09-21 15:57:36 santosh

+14

Hey! Amigo, ¿qué estás haciendo aquí? – omg

Parece una selección de rango (es decir, verifica el primer elemento, mantenga presionada la tecla shift, marque la última, y se marcan todas las que están entre ellas). Sin embargo, esto es mucho más de lo que la pregunta lo requiere. Sin embargo, falta algo de código, como checkUncheckAll(). – joelsand

Utilice el snipp de código siguiente et al .: lograr este

$('#checkAll').click(function(){ 
    $("#checkboxes input").attr('checked','checked'); 
}); 

$('#UncheckAll').click(function(){ 
    $("#checkboxes input").attr('checked',false); 
});

O usted puede hacer lo mismo con la única casilla de verificación:

$('#checkAll').click(function(e) { 
    if($('#checkAll').attr('checked') == 'checked') { 
    $("#checkboxes input").attr('checked','checked'); 
    $('#checkAll').val('off'); 
    } else { 
    $("#checkboxes input").attr('checked', false); 
    $('#checkAll').val('on'); 
    } 
});

Para demostración: http://jsfiddle.net/creativegala/hTtxe/

Fuente

2011-11-16 09:24:23

El clic afectará una etiqueta si tenemos una conectada a la casilla de entrada?

creo que es mejor usar la función .Cambiar()

<input type="checkbox" id="something" /> 

$("#something").change(function(){ 
    alert("state changed"); 
});

Fuente

2012-01-04 08:31:00

para jQuery 1.7+ uso:

$('input[type=checkbox]').on('change', function() { 
    ... 
});

Fuente

2014-06-18 20:56:10

En mi experiencia, he tenido que aprovechar currentTarget del evento :

$("#dingus").click(function (event) { 
    if ($(event.currentTarget).is(':checked')) { 
    //checkbox is checked 
    } 
});

Fuente

2015-04-27 05:30:03

Este código hace lo que su necesidad:

<input type="checkbox" id="check" >check it</input> 

$("#check").change(function(){ 
    if($(this).is(':checked')) { 
     alert("checked"); 
    }else{ 
     alert("unchecked"); 
    } 
});

Además, puede comprobarlo en jsfiddle

Fuente

2016-09-07 13:35:33

Catch marcado evento de cambio de una casilla de verificación

Respuesta

Cuestiones relacionadas