Catch check change event of checkbox

Jak mogę złapać check/uncheck event z <input type="checkbox" /> z jQuery?Catch check change event of checkbox

2009-09-21 omg

Jeśli używasz stosunkowo nową wersję JQuery, chciałbym użyć .Na („zmiana”, function() {...}) jak wspomniano w @Daniel De Leon's below below. Zaletą, detektor zdarzeń "on" będzie wiązał się z dynamicznie generowanym html. – BLang

127

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

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

Edit: Rozwiązanie to nie złapie, gdy pole zmienia się z innych powodów niż kliknięcia, jak za pomocą klawiatury. Aby uniknąć tego problemu, posłuchaj change zamiast click.

Przez zaznaczenie/odznaczenie programowo, spojrzeć na Why isn't my checkbox change event triggered?

Źródło

2009-09-21 15:50:11 marcgg

document.getElementById ('coś') sprawdzone prace, dlaczego $ ('# coś') sprawdzane.. nie działa? – omg

W twoim kodzie brakuje paran i naprawdę powinieneś używać metody jQuery do sprawdzania stanu. –

Bo $ („# coś”) zwraca obiekt jQuery nie jest ElementNode –

użyć zdarzenia click dla najlepszej kompatybilności z MSIE

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

Źródło

2009-09-21 15:48:23

Jak ocenić, czy jest on sprawdzony, czy nie? – omg

Muszę wiedzieć, czy kliknięcie oznacza to zaznaczenie lub odznaczenie. – omg

można użyć $ (this) .is (': sprawdzane') aby sprawdzić stan tylko-klikniętego elementu –

użyć selektora :checked celu określenia stanu pole wyboru jest:

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

Źródło

2009-09-21 15:51:10 karim79

Potrzebuję innego nawiasu w twoim stanie ... jeśli ($ (this) ... –

@Ty W - dzięki, naprawione – 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>

Źródło

2009-09-21 15:57:36 santosh

+14

Hej! Kolego, co tu robisz? – omg

Wygląda jak wybór zakresu (np. pierwszy element, przytrzymaj shift w dół, sprawdź ostatni i wszystkie są sprawdzane.) Jednak jest to znacznie więcej, niż pytanie, na które prosi, brakuje jakiegoś kodu, jak checkUncheckAll(). – joelsand

Użyj poniższego fragmentu kodu i aby to osiągnąć .:

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

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

Albo można zrobić to samo pole pojedynczego wyboru z:

$('#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'); 
    } 
});

Dla Demo: http://jsfiddle.net/creativegala/hTtxe/

Źródło

2011-11-16 09:24:23

Kliknięcie wpłynie etykietę jeśli mamy podłączony do pola wyboru wejścia?

myślę, że lepiej jest użyć funkcji .change()

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

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

Źródło

2012-01-04 08:31:00

dla jQuery 1.7+ zastosowanie:

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

Źródło

2014-06-18 20:56:10

Z mojego doświadczenia wynika, miałem wykorzystać currentTarget zdarzenia, :

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

Źródło

2015-04-27 05:30:03

Ten kod robi to, co swoje potrzeby:

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

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

Ponadto, można to sprawdzić na jsfiddle

Źródło

2016-09-07 13:35:33

Catch check change event of checkbox

Odpowiedz

Powiązane problemy