Einstellung für "jQuery" aktiviert

Ich möchte etwas ähnliches tun, um das checkbox mit jQuery zu markieren:

 $(".myCheckBox").checked(true); 

oder

 $(".myCheckBox").selected(true); 

Gibt es so etwas?

3600
09 янв. tpower ist am 09. Januar eingestellt 2009-01-09 01:20 09 um 01:20 2009-01-09 01:20
@ 38 Antworten
  • 1
  • 2

jQuery 1.6 +

Verwenden Sie die neue Methode .prop() :

 $('.myCheckbox').prop('checked', true); $('.myCheckbox').prop('checked', false); 

jQuery 1.5.x und darunter

Die .prop() -Methode ist nicht verfügbar, daher müssen Sie .attr() .

 $('.myCheckbox').attr('checked', true); $('.myCheckbox').attr('checked', false); 

Bitte beachten Sie, dass dies der Ansatz ist, der von jQuery modular tests bis Version 1.6 verwendet wird und zu bevorzugen ist

 $('.myCheckbox').removeAttr('checked'); 

da letztere das Verhalten des .reset() Aufrufs in einer beliebigen Form ändert, wenn das Kontrollkästchen ursprünglich gesetzt wurde, ist dies eine .reset() , aber möglicherweise unerwünschte Änderung des Verhaltens.

Eine ausführlichere Beschreibung einiger unvollständiger Besprechungen von Änderungen in der Attributverarbeitung / -eigenschaften beim Wechsel von 1.5.x auf 1.6 finden Sie in Version 1.6 und in der Dokumentation zu Attributes und Properties von .prop() .

Jede jQuery-Version

Wenn Sie nur mit einem Element arbeiten, können Sie die Eigenschaft HTMLInputElement .checked immer einfach ändern:

 $('.myCheckbox')[0].checked = true; $('.myCheckbox')[0].checked = false; 

Der Vorteil der Verwendung der .prop() und .attr() ist, dass sie mit allen konsistenten Elementen arbeiten.

5405
09 янв. Die Antwort ist Xian 09 Januar gegeben. 2009-01-09 01:25 09 um 01:25 Uhr 2009-01-09 01:25

Verwenden:

 $(".myCheckbox").attr('checked', true); // Deprecated $(".myCheckbox").prop('checked', true); 
border=0

Und wenn Sie prüfen möchten, ob das Kästchen markiert ist oder nicht:

 $('.myCheckbox').is(':checked'); 
623
09 янв. Die Antwort ist bchhun Jan 09 gegeben 2009-01-09 01:25 09 um 01:25 Uhr 2009-01-09 01:25

Dies ist die richtige Methode zum Aktivieren und Deaktivieren von Kontrollkästchen mit jQuery, da dies ein plattformübergreifender Standard ist, mit dem Sie Berichte senden können.

 $('.myCheckBox').each(function(){ this.checked = true; }); $('.myCheckBox').each(function(){ this.checked = false; }); 

Gleichzeitig verwenden Sie JavaScript-Standards zum Aktivieren und Deaktivieren von Kontrollkästchen, sodass alle Browser, die die Eigenschaft checked des Checkbox-Elements korrekt implementieren, einwandfrei mit diesem Code funktionieren. Es sollten alle gängigen Browser sein, Internet Explorer 9 kann ich jedoch noch nicht testen.

Problem (jQuery 1.6):

Sobald der Benutzer auf das Kontrollkästchen klickt, reagiert das Kontrollkästchen nicht mehr auf Änderungen des Attributs "geprüft".

Hier ist ein Beispiel für das Attribut des Kontrollkästchens, das die Aufgabe nicht ausführen konnte, nachdem jemand auf dieses Kontrollkästchen geklickt hat (dies geschieht in Chrome).

Feeddle

Lösung:

Mit der "geprüften" JavaScript-Eigenschaft für DOM- Elemente können wir das Problem direkt lösen, anstatt zu versuchen, das DOM so zu manipulieren, dass es das tut, was wir tun wollen.

Feeddle

Dieses Plugin ändert die geprüfte Eigenschaft aller von jQuery ausgewählten Elemente und prüft und deaktiviert die Kontrollkästchen unter allen Umständen. Obwohl dies wie eine unnötige Entscheidung erscheinen mag, wird dies Ihre Website komfortabler und hilft dabei, Benutzerfrust zu vermeiden.

 (function( $ ) { $.fn.checked = function(value) { if(value === true || value === false) { // Set the value of the checkbox $(this).each(function(){ this.checked = value; }); } else if(value === undefined || value === 'toggle') { // Toggle the checkbox $(this).each(function(){ this.checked = !this.checked; }); } return this; }; })( jQuery ); 

Wenn Sie das Plugin nicht verwenden möchten, können Sie alternativ die folgenden Code-Snippets verwenden:

 // Check $(':checkbox').prop('checked', true); // Un-check $(':checkbox').prop('checked', false); // Toggle $(':checkbox').prop('checked', function (i, value) { return !value; }); 
284
06 мая '11 в 22:31 2011-05-06 22:31 Antwort wird von cwharris gegeben 6. Mai 11 um 22:31 2011-05-06 22:31

Du kannst es tun

 $('.myCheckbox').attr('checked',true) //Standards compliant 

oder

 $("form #mycheckbox").attr('checked', true) 

Wenn Sie im Onclick-Ereignis benutzerdefinierten Code für das Kontrollkästchen haben, das Sie ausführen möchten, verwenden Sie stattdessen Folgendes:

 $("#mycheckbox").click(); 

Sie können das Kontrollkästchen deaktivieren, indem Sie das Attribut vollständig entfernen:

 $('.myCheckbox').removeAttr('checked') 

Sie können alle Kontrollkästchen wie folgt markieren:

 $(".myCheckbox").each(function(){ $("#mycheckbox").click() }); 
130
09 янв. antwortete Micah Jan 09 2009-01-09 01:24 09 um 01:24 2009-01-09 01:24

Sie können das $ .fn-Objekt auch mit neuen Methoden erweitern:

 (function($) { $.fn.extend({ check : function() { return this.filter(":radio, :checkbox").attr("checked", true); }, uncheck : function() { return this.filter(":radio, :checkbox").removeAttr("checked"); } }); }(jQuery)); 

Dann können Sie einfach folgendes tun:

 $(":checkbox").check(); $(":checkbox").uncheck(); 

Wenn Sie eine andere Bibliothek verwenden, die diese Namen verwendet, können Sie ihnen eindeutigere Namen wie mycheck () und myuncheck () geben.

67
20 авг. Die Antwort wird gegeben . 2010-08-20 21:19 '10 um 21:19 2010-08-20 21:19
 $("#mycheckbox")[0].checked = true; $("#mycheckbox").attr('checked', true); $("#mycheckbox").click(); 

Letzteres aktiviert ein Klickereignis für dieses Kontrollkästchen, andere jedoch nicht. Wenn Sie also im Onclick-Ereignis benutzerdefinierten Code für das Kontrollkästchen haben, das Sie ausführen möchten, verwenden Sie das letztere.

58
09 янв. Die Antwort wird von Chris Brandsma 09 Jan gegeben 2009-01-09 01:36 09 um 01:36 2009-01-09 01:36

Um das Kontrollkästchen zu aktivieren, müssen Sie verwenden

  $('.myCheckbox').attr('checked',true); 

oder

  $('.myCheckbox').attr('checked','checked'); 

und um das Häkchen zu entfernen, müssen Sie den Wert immer auf false setzen:

  $('.myCheckbox').attr('checked',false); 

Wenn du es tust

  $('.myCheckbox').removeAttr('checked') 

Es entfernt das Attribut zusammen und Sie können das Formular daher nicht zurücksetzen.

BAD DEMO jQuery 1.6 . Ich denke es ist kaputt. Für 1.6 werde ich einen neuen Beitrag schreiben.

NEUE WORKING-DEMO jQuery 1.5.2 funktioniert in Chrome.

Beide Demos verwenden

 $('#tc').click(function() { if ( $('#myCheckbox').attr('checked')) { $('#myCheckbox').attr('checked', false); } else { $('#myCheckbox').attr('checked', 'checked'); } }); 
56
23 марта '11 в 18:22 2011-03-23 18:22 Die Antwort wird von Mcgrailm am 23. März 11 um 18:22 Uhr 2011-03-23 ​​18:22 gegeben

Die Frage annehmen ...

Wie kann man das Kontrollkästchen BY VALUE setzen?

Denken Sie daran, dass in einem typischen Kontrollkästchen alle Eingabe-Tags denselben Namen haben und sich im value Attribut unterscheiden : Für jede Eingabe des Satzes gibt es keinen Bezeichner.

Die Xi'an-Antwort kann mit einer spezifischeren Auswahl unter Verwendung der folgenden Codezeile erweitert werden:

 $("input.myclass[name='myname'][value='the_value']").prop("checked", true); 
42
09 марта '12 в 15:28 2012-03-09 15:28 Die Antwort wird von Peter Krauss am 09. März '12 um 15:28 2012-03-09 15:28 gegeben

Ich vermisse die Lösung. Ich werde immer verwenden:

 if ($('#myCheckBox:checked').val() !== undefined) { //Checked } else { //Not checked } 
42
24 июня '12 в 14:33 2012-06-24 14:33 Die Antwort wird von Overbeeke am 24. Juni 12 um 14:33 2012-06-24 14:33 gegeben

Es wählt Elemente mit dem angegebenen Attribut mit einem Wert aus, der den angegebenen Teilstring "ckbItem" enthält:

 $('input[name *= ckbItem]').prop('checked', true); 

Er wählt alle Elemente aus, die ckbItem in der name-Eigenschaft enthalten.

37
20 сент. Die Antwort wird von Abou-Emish 20 Sep gegeben . 2010-09-20 14:43 '10 um 14:43 Uhr 2010-09-20 14:43 Uhr

Gehen Sie folgendermaßen vor, um ein Flag mit jQuery 1.6 oder höher festzulegen :

 checkbox.prop('checked', true); 

Um das Kontrollkästchen zu deaktivieren, verwenden Sie:

 checkbox.prop('checked', false); 

Ich verwende gerne, um mit jQuery eine Flagge zu wechseln:

 checkbox.prop('checked', !checkbox.prop('checked')); 

Wenn Sie jQuery 1.5 oder niedriger verwenden:

 checkbox.attr('checked', true); 

Um das Kontrollkästchen zu deaktivieren, verwenden Sie:

 checkbox.attr('checked', false); 
36
14 марта '13 в 12:40 2013-03-14 12:40 Die Antwort wird von Ramon de Jesus am 14. März 13 um 12:40 Uhr 2013-03-14 12:40 gegeben

Hier ist eine Möglichkeit, dies ohne jQuery zu tun

 <label>Click Me! <input id="cb" type="checkbox" /> </label> <label>Reflection: <input id="rcb" type="checkbox" /> </label> 
33
23 окт. Antworten Aeoril 23. Oktober 2012-10-23 03:41 '12 um 03:41 Uhr 2012-10-23 03:41

Versuchen Sie folgendes:

 $('#checkboxid').get(0).checked = true; //For checking $('#checkboxid').get(0).checked = false; //For unchecking 
28
10 сент. Die Antwort wird prashanth 10 Sep. gegeben. 2012-09-10 13:26 '12 um 13:26 2012-09-10 13:26

Hier ist der Code für die markierten und ungeprüften mit der Schaltfläche:

 var set=1; var unset=0; jQuery( function() { $( '.checkAll' ).live('click', function() { $( '.cb-element' ).each(function () { if(set==1){ $( '.cb-element' ).attr('checked', true) unset=0; } if(set==0){ $( '.cb-element' ).attr('checked', false); unset=1; } }); set=unset; }); }); 

Aktualisieren. Hier ist derselbe Codeblock, der die neue Jquery 1.6+-Supportmethode verwendet, die attr ersetzt:

 var set=1; var unset=0; jQuery( function() { $( '.checkAll' ).live('click', function() { $( '.cb-element' ).each(function () { if(set==1){ $( '.cb-element' ).prop('checked', true) unset=0; } if(set==0){ $( '.cb-element' ).prop('checked', false); unset=1; } }); set=unset; }); }); 
25
25 окт. Antwort von starjahid 25. Oktober 2011-10-25 11:51 '11 am 11:51 2011-10-25 11:51

Wir können elementObject mit jQuery verwenden, um das Attribut zu testen:

 $(objectElement).attr('checked'); 

Wir können dies für alle Versionen von jQuery ohne Fehler verwenden.

Update: jQuery 1.6+ hat eine neue prop-Methode, die attr ersetzt, zum Beispiel:

 $(objectElement).prop('checked'); 
23
24 июня '11 в 11:27 2011-06-24 11:27 Die Antwort gibt Prasanth P am 24. Juni 11 um 11:27 2011-06-24 11:27

Wenn Sie die PhoneGap- Anwendungsentwicklung verwenden und einen Wert für eine Schaltfläche haben, den Sie sofort anzeigen möchten, vergessen Sie nicht, dies zu tun.

 $('span.ui-[controlname]',$('[id]')).text("the value"); 

Ich habe festgestellt, dass ohne einen Bereich die Schnittstelle nicht aktualisiert wird, egal was Sie tun.

23
17 апр. Die Antwort ist Clement Ho 17. April gegeben. 2012-04-17 09:34 '12 um 09:34 Uhr 2012-04-17 09:34 Uhr

Hier ist der Code und eine Demonstration, wie man mehrere Checkboxen anklickt ...

http://jsfiddle.net/tamilmani/z8TTt/

 $("#check").on("click", function () { var chk = document.getElementById('check').checked; var arr = document.getElementsByTagName("input"); if (chk) { for (var i in arr) { if (arr[i].name == 'check') arr[i].checked = true; } } else { for (var i in arr) { if (arr[i].name == 'check') arr[i].checked = false; } } }); 
22
16 авг. Die Antwort wird auf Tamilmani 16 gegeben. 2013-08-16 09:17 13 um 09:17 2013-08-16 09:17

Andere mögliche Lösung:

  var c = $("#checkboxid"); if (c.is(":checked")) { $('#checkboxid').prop('checked', false); } else { $('#checkboxid').prop('checked', true); } 
19
12 окт. Antwort von Muhammad Aamir Ali am 12. Oktober 2013-10-12 11:23 13 um 11:23 2013-10-12 11:23

Für jQuery 1.6 +

 $('.myCheckbox').prop('checked', true); $('.myCheckbox').prop('checked', false); 

Für jQuery 1.5.x und darunter

 $('.myCheckbox').attr('checked', true); $('.myCheckbox').attr('checked', false); 

Zu überprüfen

 $('.myCheckbox').removeAttr('checked'); 
17
21 апр. die antwort wird gegeben logan 21 apr 2015-04-21 13:29 '15 um 13:29 Uhr 2015-04-21 13:29

Denken Sie an Speicherlecks in Internet Explorer vor Internet Explorer 9 , z. B. den Status der jQuery-Dokumentation :

In Internet Explorer bis Version 9 kann die Verwendung von .prop () eines DOM-Elements für einen anderen als einen einfachen Grundwert (number, string oder boolean) einen Speicherverlust verursachen, wenn die Eigenschaft vor dem Löschen nicht entfernt wird (mithilfe von .removeProp ()) DOM-Element aus dem Dokument. Verwenden Sie .data (), um sicher Werte für DOM-Objekte ohne Leckspeicher festzulegen.

17
22 мая '13 в 10:25 2013-05-22 10:25 Die Antwort wird am 22. Mai 13 um 10:25 2013-05-22 10:25 gegeben

Wenn Sie ein Mobiltelefon verwenden und möchten, dass die Benutzeroberfläche aktualisiert wird und das Kontrollkästchen deaktiviert ist, verwenden Sie Folgendes:

 $("#checkbox1").prop('checked', false).checkboxradio("refresh"); 
17
11 янв. Die Antwort gibt Matt Peacock am 11. Januar. 2013-01-11 16:05 13 am 16:05 2013-01-11 16:05

Überprüfen und deaktivieren

 $('.myCheckbox').prop('checked', true); $('.myCheckbox').prop('checked', false); 
16
14 нояб. Die Antwort ist gegeben jj2422 14 Nov. 2013-11-14 09:34 '13 am 9:34 2013-11-14 09:34
 $('controlCheckBox').click(function(){ var temp = $(this).prop('checked'); $('controlledCheckBoxes').prop('checked', temp); }); 
15
16 июля '13 в 5:10 2013-07-16 05:10 Die Antwort wird gegeben mahmoh 16. Juli 13 um 05:10 Uhr 2013-07-16 05:10

Dies ist wahrscheinlich die kürzeste und einfachste Lösung:

 $(".myCheckBox")[0].checked = true; 

oder

 $(".myCheckBox")[0].checked = false; 

Noch kürzer wird sein:

 $(".myCheckBox")[0].checked = !0; $(".myCheckBox")[0].checked = !1; 

Hier ist jsFiddle .

14
27 мая '14 в 18:11 2014-05-27 18:11 Die Antwort gibt frieder am 27. Mai 14 um 18:11 2014-05-27 18:11

Normales JavaScript ist sehr einfach und viel weniger Aufwand:

 var elements = document.getElementsByClassName('myCheckBox'); for(var i = 0; i < elements.length; i++) { elements[i].checked = true; } 

Beispiel hier

13
18 сент. Die Antwort ist Alex W 18 Sep gegeben. 2013-09-18 04:14 '13 am 4:14 2013-09-18 04:14

Wenn Sie das Kästchen markieren, zum Beispiel:

 $('.className').attr('checked', 'checked') 

das kann nicht genug sein. Sie müssen auch die Funktion unten aufrufen.

 $('.className').prop('checked', 'true') 

Insbesondere wenn Sie das Kontrollkästchen "Attribut prüfen" entfernt haben.

12
05 марта '15 в 16:10 2015-03-05 16:10 Die Antwort wird von Serhat Koroglu am 5. März 15 um 16:10 Uhr 2015-03-05 16:10 gegeben

Ich konnte es nicht schaffen mit:

 $("#cb").prop('checked', 'true'); $("#cb").prop('checked', 'false'); 

Sowohl wahr als auch falsch setzen eine Flagge. Was für mich funktioniert hat:

 $("#cb").prop('checked', 'true'); // For checking $("#cb").prop('checked', ''); // For unchecking 
11
05 янв. die antwort ist fredcrs 05 jan gegeben. 2012-01-05 16:26 '12 um 16:26 Uhr 2012-01-05 16:26

Als @ livefree75 sagte:

jQuery 1.5.x und darunter

Sie können das $ .fn-Objekt auch mit neuen Methoden erweitern:

 (function($) { $.fn.extend({ check : function() { return this.filter(":radio, :checkbox").attr("checked", true); }, uncheck : function() { return this.filter(":radio, :checkbox").removeAttr("checked"); } }); }(jQuery)); 

In neuen Versionen von jQuery müssen wir jedoch Folgendes verwenden:

jQuery 1.6 +

  (function($) { $.fn.extend({ check : function() { return this.filter(":radio, :checkbox").prop("checked", true); }, uncheck : function() { return this.filter(":radio, :checkbox").prop("checked",false); } }); }(jQuery)); 

Dann können Sie einfach folgendes tun:

  $(":checkbox").check(); $(":checkbox").uncheck(); 
11
23 сент. Die Antwort gibt Ardalan Shahgholi vom 23. September 2016-09-23 21:43 '16 am 21:43 2016-09-23 21:43

JQuery

 if($("#checkboxId").is(':checked')){ alert("Checked"); } 

oder

 if($("#checkboxId").attr('checked')==true){ alert("Checked"); } 

In Javascript

 if (document.getElementById("checkboxID").checked){ alert("Checked"); } 
10
10 июня '13 в 16:17 2013-06-10 16:17 Die Antwort wird von ijarlax am 10. Juni 13 um 16:17 Uhr 2013-06-10 16:17 gegeben

Hier ist die vollständige Antwort mit jQuery

Ich teste es und es funktioniert bei 100%: D

  // when the button (select_unit_button) is clicked it returns all the checed checkboxes values $("#select_unit_button").on("click", function(e){ var arr = []; $(':checkbox:checked').each(function(i){ arr[i] = $(this).val(); // u can get id or anything else }); //console.log(arr); // u can test it using this in google chrome }); 
10
27 февр. Antwort von user1477929 am 27. Februar 2013-02-27 18:49 13 um 18:49 2013-02-27 18:49
  • 1
  • 2

Andere Fragen zu Tags oder Frage stellen