eventos - onchange checkbox jquery

Conflicto de fila y casilla de verificación en el que se puede hacer clic

Question

Hice la fila de mi tabla pulsable con esta función.

    $("#grid tbody tr").click(function () {
    var $checkbox = $(this).find('':checkbox'');
    $checkbox.attr(''checked'', !$checkbox.attr(''checked''));
});

y funciona bien, sin embargo, cuando intento hacer clic en la casilla de verificación, no funciona. ¿Qué debo hacer para que ambos funcionen?

Answer 1

Prueba esto

$(''#grid tbody tr input:checked'').click(function(e) {
    e.stopPropagation();
});

Answer 2

Todas estas respuestas funcionan bien, pero estuve atascado por un largo tiempo tratando de averiguar por qué no podía hacer que funcionaran. Estaba generando dinámicamente las filas de mi tabla y aún no existían en el DOM. Por esta razón, ninguna de las soluciones funcionó.

Lo que resolvió esto para mí fue usar el método on() .

$(''body'').on(''click'', ''#grid tbody  tr'', function (e) {

Answer 3

Usando un solo controlador de eventos:

$("#grid tbody tr").click(function(e) {
    if (e.target.type == "checkbox") {

        // stop the bubbling to prevent firing the row''s click event
        e.stopPropagation();
    } else {
        var $checkbox = $(this).find('':checkbox'');
        $checkbox.attr(''checked'', !$checkbox.attr(''checked''));
    }
});

http://jsfiddle.net/karim79/UX2Fv/

Answer 4

mejor u puede hacer esto con HTML simple, escriba for atributo en label

<input type="checkbox" id="myCheck"><label for="myCheck">CheckThis</label>
                              ^                   ^

Nota : id de <input type="checkbox" sería el valor de for atributo en <label>

DEMO

Answer 5

$(''#grid tbody tr input:checkbox'').click(function(e) {
    e.stopPropagation();
});

Luego, al hacer clic en la casilla de verificación no se activará un evento de clic en el tr.