Wenn ich eine Funktion an ein Kontrollkästchen binde, wie:
$("#myCheckbox").click( function() {
alert($(this).is(":checked"));
});
Das Kontrollkästchen ändert sein markiertes Attribut, bevor das Ereignis ausgelöst wird. Dies ist das normale Verhalten und führt zu einem umgekehrten Ergebnis.
Wenn ich jedoch:
$("#myCheckbox").click();
Das Kontrollkästchen ändert das Attribut "Aktiviert", nachdem das Ereignis ausgelöst wurde.
Meine Frage ist, gibt es eine Möglichkeit, das Klickereignis von jQuery aus auszulösen, wie es ein normaler Klick tun würde (erstes Szenario)?
PS: Ich habe es schon versucht mit trigger('click')
;
Antworten:
Hinweis: In älteren Versionen von jquery war die Verwendung in Ordnung
attr
. Jetzt wird empfohlen,prop
den Status zu lesen.quelle
Es gibt eine Problemumgehung , die in jQuery 1.3.2 und 1.4.2 funktioniert :
Aber ich stimme zu, dieses Verhalten scheint im Vergleich zum nativen Ereignis fehlerhaft zu sein.
quelle
Ab Juni 2016 (unter Verwendung von jquery 2.1.4) funktioniert keine der anderen vorgeschlagenen Lösungen. Das Überprüfen
attr('checked')
kehrt immer zurückundefined
undis('checked)
kehrt immer zurückfalse
.Verwenden Sie einfach die Requisitenmethode:
quelle
is('checked)
wird false zurückgeben, da "geprüft" kein CSS-Pseudo-Selektor ist. Das richtige sollte sein,is(':checked')
damit es stattdessen nach ": checked" sucht.Ich habe dieses Verhalten immer noch mit jQuery 1.7.2. Eine einfache Problemumgehung besteht darin, die Ausführung des Klick-Handlers mit setTimeout zu verschieben und den Browser in der Zwischenzeit seine Magie entfalten zu lassen:
quelle
.click()
, dann setzen.attr('value', 'true')
, dann.change()
,.blur()
bevor es programmgesteuert die Box setzen würde, wenn ich programmgesteuert auf die Schaltfläche "Aktualisieren" klickte ....Wenn Sie dieses eher unerwünschte Verhalten antizipieren, besteht eine Möglichkeit darin, einen zusätzlichen Parameter aus jQuery.trigger () an den Klick-Handler des Kontrollkästchens zu übergeben. Dieser zusätzliche Parameter soll den Klick-Handler darüber informieren, dass der Klick programmgesteuert ausgelöst wurde, anstatt dass der Benutzer direkt auf das Kontrollkästchen selbst klickt. Der Klick-Handler des Kontrollkästchens kann dann den gemeldeten Prüfstatus invertieren.
So würde ich das Klickereignis für ein Kontrollkästchen mit der ID "myCheckBox" auslösen. Beachten Sie, dass ich auch einen Objektparameter mit einem einzelnen Element, nonUI, übergebe, das auf true gesetzt ist:
Und so gehe ich damit im Click-Event-Handler des Kontrollkästchens um. Die Handlerfunktion prüft, ob das nonUI-Objekt als zweiter Parameter vorhanden ist. (Der erste Parameter ist immer das Ereignis selbst.) Wenn der Parameter vorhanden und auf true gesetzt ist, invertiere ich den gemeldeten Status .checked. Wenn kein solcher Parameter übergeben wird - was nicht der Fall ist, wenn der Benutzer einfach auf das Kontrollkästchen in der Benutzeroberfläche geklickt hat -, melde ich den tatsächlichen Status .checked:
JSFiddle-Version unter http://jsfiddle.net/BrownieBoy/h5mDZ/
Ich habe mit Chrome, Firefox und IE 8 getestet.
quelle
quelle
quelle
JSFIDDLE
quelle
Nun, um zum ersten Szenario zu passen, habe ich mir das ausgedacht.
http://jsbin.com/uwupa/edit
Anstatt das "Klick" -Ereignis zu binden, binden Sie im Wesentlichen das "Änderungs" -Ereignis mit der Warnung.
Wenn Sie dann das Ereignis auslösen, lösen Sie zuerst einen Klick und dann eine Änderung aus.
quelle
Zusätzlich zur Antwort von Nick Craver
IE 8
müssen Sie dem Kontrollkästchen einen zusätzlichen Klick-Handler hinzufügen , damit dies ordnungsgemäß funktioniert :Andernfalls wird der Rückruf nur ausgelöst, wenn das Kontrollkästchen den Fokus verliert, da
IE 8
Kontrollkästchen und Funkgeräte beim Klicken weiterhin im Fokus bleiben.Habe aber nicht getestet
IE 9
.quelle
quelle
change
anstelle der OPs verwendet wirdclick
, und verwendet lediglich eineif
Anweisung als eine andere Art des Testens:checked
.Schnellster und einfachster Weg :
$ el - ist ein Abfrageelement der Auswahl.
Genießen!
quelle
quelle