Fangen überprüfte Änderungsereignis einer Checkbox

Wie kann ich das Ereignis von <input type="checkbox" /> mit jQuery abfangen/abhaken?Fangen überprüfte Änderungsereignis einer Checkbox

Quelle

2009-09-21 omg

Wenn Sie eine relativ neue Version von JQuery verwenden, würde ich die .on verwenden ('change', function() {...}) wie erwähnt in @Daniel De Leons Antwort unten. Ein Vorteil ist, dass der Ereignis-Listener "on" an dynamisch erzeugtes HTML bindet. – BLang

127

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

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

Edit: Dadurch wird nicht fangen, wenn das Kontrollkästchen aus anderen Gründen als einem Klick ändert sich, wie die Tastatur. Um dieses Problem zu vermeiden, hören Sie statt click.

Zur Überprüfung/unchecking programmatisch, werfen Sie einen Blick auf Why isn't my checkbox change event triggered?

Quelle

2009-09-21 15:50:11 marcgg

document.getElementById ('something') zu testen. Checked works, warum $ ('# something') nicht arbeiten? – omg

Ihr Code fehlt ein Paran und sollte wirklich die jQuery-Methode verwenden, um den Prüfstatus zu erhalten. –

Da $ ('# something') ein jQuery-Objekt und keine ElementNode zurückgibt –

das Click-Ereignis mit MSIE für beste Kompatibilität verwenden

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

Quelle

2009-09-21 15:48:23

Wie kann man beurteilen, ob es überprüft wird oder nicht? – omg

Ich muss wissen, ob ein Klick bedeutet, es zu aktivieren oder zu deaktivieren. – omg

können Sie dann $ (this) .is (': checked') verwenden, um den Status des gerade angeklickten Elements –

Verwenden :checked Selektor das Kontrollkästchen der Zustand zu bestimmen:

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

Quelle

2009-09-21 15:51:10 karim79

brauche eine weitere Klammer in deinem Zustand ... if ($ (this) ... –

@Ty W - danke, behoben. – 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>

Quelle

2009-09-21 15:57:36 santosh

+14

Hey! Kumpel, was machst du hier? – omg

Sieht aus wie eine Bereichsauswahl (dh, überprüfe die erster Punkt, halte die Shift-Taste gedrückt, überprüfe die letzte, und alle dazwischen werden überprüft.) Das ist jedoch viel mehr, als die Frage verlangt: Es fehlt jedoch ein Code wie checkUncheckAll(). – joelsand

Verwenden Sie unter Code-Snipp et um dies zu erreichen .:

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

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

Oder Sie können das gleiche mit einzelnen Kontrollkästchen tun:

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

Für Demo: http://jsfiddle.net/creativegala/hTtxe/

Quelle

2011-11-16 09:24:23

Der Klick ein Etikett beeinflussen, wenn wir eine haben angebracht zur Eingabe-Checkbox?

Ich denke, dass besser ist die .change() Funktion

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

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

Quelle

2012-01-04 08:31:00

Für JQuery 1.7+ Gebrauch zu verwenden:

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

Quelle

2014-06-18 20:56:10

Nach meiner Erfahrung, ich habe die Veranstaltungs-current musste nutzen :

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

Quelle

2015-04-27 05:30:03

Dieser Code macht, was Ihr Bedürfnis:

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

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

Auch Sie können es auf jsfiddle

Quelle

2016-09-07 13:35:33

Fangen überprüfte Änderungsereignis einer Checkbox

Antwort

Verwandte Themen