Kako provjeriti je li jQuery označen?

Moram checked svojstvo checked zastavice i izvršiti radnju na temelju provjerenog svojstva pomoću jQuery.

Na primjer, ako je označen potvrdni okvir za dob, moram prikazati tekstualni okvir za unos godina, inače sakriti tekstualni okvir.

Ali sljedeći kôd po defaultu vraća false :

 if ($('#isAgeSelected').attr('checked')) { $("#txtAge").show(); } else { $("#txtAge").hide(); } 

Kako uspješno dohvatiti checked svojstvo?

3928
23 мая '09 в 18:16 2009-05-23 18:16 Prasad je dan 23. svibnja u 18:16 2009-05-23 18:16
@ 58 odgovora
  • 1
  • 2

To mi je pomoglo:

 $get("isAgeSelected ").checked == true 

Gdje je isAgeSelected je kontrolni ID.

Osim toga, @ karim79 odgovor radi dobro. Nisam siguran što sam propustio kad sam ga testirao.

Napomena. Ovaj odgovor koristi Microsoft Ajax, a ne jQuery.

83
24 мая '09 в 8:30 2009-05-24 08:30 odgovor je dat Prasad 24. svibnja 2009. u 8:30 2009-05-24 08:30

Kako mogu izvršiti zahtjev za potvrđenom imovinom?

checked svojstvo elementa potvrdnog okvira DOM će vam dati checked stanje stavke.

S obzirom na vaš postojeći kôd, možete to učiniti:

 if(document.getElementById('isAgeSelected').checked) { $("#txtAge").show(); } else { $("#txtAge").hide(); } 
border=0

Međutim, postoji još lijep način da to učinite pomoću toggle :

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <input type="checkbox" id="isAgeSelected"/> <div id="txtAge" style="display:none">Age is something</div> 
3106
23 мая '09 в 18:20 2009-05-23 18:20 odgovor je dao karim79 23. svibnja 2009. u 18:20 2009-05-23 18:20

Koristite funkciju jQuery je () :

 if($("#isAgeSelected").is(':checked')) $("#txtAge").show(); // checked else $("#txtAge").hide(); // unchecked 
1553
22 июня '11 в 13:14 2011-06-22 13:14 odgovor je dat Bhanu Krishnanu 22. lipnja 2011. u 13:14 sati 2011-06-22 13:14

Korištenje jQuery> 1.6

 <input type="checkbox" value="1" name="checkMeOut" id="checkMeOut" checked="checked" /> // traditional attr $('#checkMeOut').attr('checked'); // "checked" // new property method $('#checkMeOut').prop('checked'); // true 

Upotreba nove metode svojstva:

 if($('#checkMeOut').prop('checked')) { // something when checked } else { // something else when not } 
474
23 июня '11 в 20:29 2011-06-23 20:29 odgovor je dao SeanDowney 23. lipnja '11 u 20:29 2011-06-23 20:29

jQuery 1.6 +

 $('#isAgeSelected').prop('checked') 

jQuery 1.5 i niže

 $('#isAgeSelected').attr('checked') 

Bilo koja jQuery verzija

 // Assuming an event handler on a checkbox if (this.checked) 

Svi krediti su Xian .

179
20 мая '14 в 23:03 2014-05-20 23:03 odgovor je dat ungalcrys Svibanj 20 '14 u 23:03 2014-05-20 23:03

Koristim ga i radi sasvim u redu:

 $("#checkkBoxId").attr("checked") ? alert("Checked") : alert("Unchecked"); 

Napomena. Ako je označeno, vratit će se inače inače inače nedefinirano, pa je najbolje provjeriti vrijednost TRUE.

149
19 авг. Odgovor je dat Pradeepu 19. kolovoza. 2010-08-19 16:38 '10 u 16:38 2010-08-19 16:38

Upotreba:

 <input type="checkbox" name="planned_checked" checked id="planned_checked"> Planned $("#planned_checked").change(function() { if($(this).prop('checked')) { alert("Checked Box Selected"); } else { alert("Checked Box deselect"); } }); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <input type="checkbox" name="planned_checked" checked id="planned_checked"> Planned 
117
29 авг. odgovor je dat Lalji Dhameliya 29 aug. 2016-08-29 14:38 '16 u 14:38 2016-08-29 14:38

Od jQuery 1.6, ponašanje jQuery.attr() se promijenilo i korisnicima se savjetuje da ga ne koriste za dohvat stanja označenog elementom. Umjesto toga trebate koristiti jQuery.prop() :

 $("#txtAge").toggle( $("#isAgeSelected").prop("checked") // For checked attribute it returns true/false; // Return value changes with checkbox state ); 

Dvije druge značajke:

 $("#txtAge").get(0).checked $("#txtAge").is(":checked") 
106
27 апр. odgovor je dao Salman A 27. travnja. 2012-04-27 14:54 '12 u 2:54 pm 2012-04-27 14:54

Ako upotrebljavate ažuriranu verziju jquery-a, trebate se .prop metodom .prop kako biste riješili problem:

$('#isAgeSelected').prop('checked') vraća true ako je označeno, i false ako nije postavljeno. Potvrdio sam to i rano sam upao u to pitanje. $('#isAgeSelected').attr('checked') i $('#isAgeSelected').is('checked') vraća undefined , što nije dobar odgovor na situaciju. Učinite kako je prikazano u nastavku.

 if($('#isAgeSelected').prop('checked')) { $("#txtAge").show(); } else { $("#txtAge").hide(); } 

Nadam se da ovo pomaže :) - Hvala.

80
25 авг. odgovor dao Rajesh Omanakuttan 25 aug. 2013-08-25 06:11 '13 u 6:11 am 2013-08-25 06:11

Korištenje rukovatelja događaja Click za svojstvo checkbox je nepouzdano, budući da se checked svojstva mogu mijenjati za vrijeme izvršavanja samog rukovatelja događaja!

U idealnom slučaju, želite staviti svoj kod u rukovatelj change događaja, na primjer, pokreće se svaki put kada se promijeni vrijednost zastave (bez obzira na to kako se to radi).

 $('#isAgeSelected').bind('change', function () { if ($(this).is(':checked')) $("#txtAge").show(); else $("#txtAge").hide(); }); 
55
06 окт. odgovor je dat arviman 06 okt. 2011-10-06 04:12 '11 u 4:12 na 2011-10-06 04:12

Odlučio sam poslati odgovor o tome kako to učiniti bez jQuery. Samo zato što sam pobunjenik.

 var ageCheckbox = document.getElementById('isAgeSelected'); var ageInput = document.getElementById('txtAge'); // Just because of IE <333 ageCheckbox.onchange = function() { // Check if the checkbox is checked, and show/hide the text field. ageInput.hidden = this.checked ? false : true; }; 

Prvo ćete dobiti obje stavke po njihovom ID-u. Tada dodijelite checkboxe onchange događaju funkciji koja provjerava je li potvrđen okvir i postavite hidden svojstvo tekstualnog polja za dob. Ovaj primjer koristi ternarni operator.

Ovdje imate gusle da to provjerite.

dodatak

Ako je kompatibilnost unakrsnog preglednika problem, preporučujem da postavite svojstvo display CSS-a na nijedno i ugrađeno.

 elem.style.display = this.checked ? 'inline' : 'none'; 

Sporije ali kompatibilno s različitim preglednicima.

50
20 марта '12 в 22:19 2012-03-20 22:19 odgovor je dao Octavian Damiean 20. ožujka 2012. u 10:19 2012-03-20 22:19

Mislim da biste to mogli učiniti:

 if ($('#isAgeSelected :checked').size() > 0) { $("#txtAge").show(); } else { $("#txtAge").hide(); } 
40
23 мая '09 в 18:34 2009-05-23 18:34 odgovor je dat xenon 23. svibanj '09 u 18:34 2009-05-23 18:34

Postoji mnogo načina da provjerite je li potvrđen okvir za izbor:

JQuery metoda provjere valjanosti

 if (elem.checked) if ($(elem).prop("checked")) if ($(elem).is(":checked")) if ($(elem).attr('checked')) 

Provjerite primjer ili dokument:

38
14 окт. odgovor dat Parth Chavda 14. listopada. 2014-10-14 10:48 '14 u 10:48 2014-10-14 10:48

Naletio sam na isti problem. Provjerio sam ASP.NET

 <asp:CheckBox ID="chkBox1" CssClass='cssChkBox1' runat="server" /> 

U jQuery kodu, koristio sam sljedeći selektor kako bih provjerio je li zastava postavljena ili ne, a izgleda da djeluje kao šarm.

 if ($("'.cssChkBox1 input[type=checkbox]'").is(':checked')) { ... } else { ... } 

Siguran sam da možete koristiti ID umjesto CssClass,

 if ($("'#cssChkBox1 input[type=checkbox]'").is(':checked')) { ... } else { ... } 

Nadam se da ovo pomaže.

37
16 дек. Odgovor je dan Nertim 16. prosinca. 2010-12-16 21:50 '10 u 21:50 2010-12-16 21:50

Radi za mene:

  $("#isAgeSelected").click(function(){ $(this).is(':checked') ? $("#txtAge").show() : $("#txtAge").hide(); }); 
35
06 янв. odgovor je dat ashish amatya 06 jan. 2011-01-06 14:33 '11 u 14:33 2011-01-06 14:33

To je još jedan način da to učinite:

 <script src="http://code.jquery.com/jquery-1.9.1.js"></script> <input type="checkbox" id="isAgeSelected"/> <div id="txtAge" style="display:none">Age is something</div> 
33
24 авг. odgovor je dan Sangeet Shah 24 aug. 2015-08-24 15:19 '15 u 15:19 2015-08-24 15:19

Moj način da to učinim je:

 if ( $("#checkbox:checked").length ) { alert("checkbox is checked"); } else { alert("checkbox is not checked"); } 
30
06 февр. Odgovor je dan Dalius I 06 Feb. 2012-02-06 17:31 '12 u 5:31 pm 2012-02-06 17:31
 $(document).ready(function() { $('#agecheckbox').click(function() { if($(this).is(":checked")) { $('#agetextbox').show(); } else { $('#agetextbox').hide(); } }); }); 
30
25 нояб. Odgovor koji daje Jumper Pot 25 Nov. 2014-11-25 15:25 '14 u 15:25 2014-11-25 15:25

Ovaj kôd možete koristiti:

 $('#isAgeSelected').click(function(){ console.log(this.checked); if(this.checked == true) { $("#txtAge").show(); } else { $("#txtAge").hide(); } }); 
30
13 окт. odgovor dao sandeep kumar 13. listopada 2016-10-13 09:03 '16 u 9:03 am 2016-10-13 09:03
 $(selector).attr('checked') !== undefined 

Vraća true ako je ulaz potvrđen i ako nije.

30
12 февр. odgovor je dat fe_lix_ 12. veljače. 2012-02-12 18:15 '12 u 18:15 2012-02-12 18:15

Koristite ovo:

 if ($('input[name="salary_in.Basic"]:checked').length > 0) 

Ako je označeno, duljina je veća od nule.

29
27 июля '16 в 12:46 2016-07-27 12:46 odgovor je dao Hamid NK 27. srpnja 2006. u 12:46 2016-07-27 12:46

Možete koristiti:

  if(document.getElementById('isAgeSelected').checked) $("#txtAge").show(); else $("#txtAge").hide(); 

 if($("#isAgeSelected").is(':checked')) $("#txtAge").show(); else $("#txtAge").hide(); 

Oba bi trebala raditi.

28
28 апр. Odgovor je dao Muhammad Awais 28. travnja 2016-04-28 15:07 '16 u 15:07 2016-04-28 15:07

Ovaj primjer je za gumb.

Pokušajte sljedeće:

 <input type="button" class="check" id="checkall" value="Check All" />  <input type="button" id="remove" value="Delete" /> <br/> <input type="checkbox" class="cb-element" value="1" /> Checkbox 1 <br/> <input type="checkbox" class="cb-element" value="2" /> Checkbox 2 <br/> <input type="checkbox" class="cb-element" value="3" /> Checkbox 3 <br/> $('#remove').attr('disabled', 'disabled'); $(document).ready(function() { $('.cb-element').click(function() { if($(this).prop('checked')) { $('#remove').attr('disabled', false); } else { $('#remove').attr('disabled', true); } }); $('.check:button').click(function() { var checked = !$(this).data('checked'); $('input:checkbox').prop('checked', checked); $(this).data('checked', checked); if(checked == true) { $(this).val('Uncheck All'); $('#remove').attr('disabled', false); } else if(checked == false) { $(this).val('Check All'); $('#remove').attr('disabled', true); } }); }); 
24
03 янв. odgovor je dao usayee siječnja 03 2014-01-03 13:38 '14 u 13:38 2014-01-03 13:38

Glavni odgovor nije učinio za mene. To se ipak dogodilo:

 <script type="text/javascript"> $(document).ready(function(){ $("#li_13").click(function(){ if($("#agree").attr('checked')){ $("#saveForm").fadeIn(); } else { $("#saveForm").fadeOut(); } }); }); </script> 

U osnovi, kada se klikne na element # li_13, provjerava je li element # (koji je potvrdni okvir) suglasan s .attr('checked') funkcijom. Ako je to onda fadeIn element #saveForm, a ako ne i fadeOut element saveForm.

23
10 дек. Odgovor je dat MDMoore313 10. prosinca. 2012-12-10 08:02 '12 u 8:02 2012-12-10 08:02

1) Ako HTML oznaka:

 <input type="checkbox" /> 

attr:

 $(element).attr("checked"); // Will give you undefined as initial value of checkbox is not set 

Ako se koristi propeler:

 $(element).prop("checked"); // Will give you false whether or not initial value is set 

2) Ako HTML oznaka:

  <input type="checkbox" checked="checked" />// May be like this also checked="true" 

attr:

 $(element).attr("checked") // Will return checked whether it is checked="true" 

Koristi se prop:

 $(element).prop("checked") // Will return true whether checked="checked" 
23
30 окт. odgovor je dao Somnath Kharat 30. listopada. 2013-10-30 15:43 '13 u 15:43 2013-10-30 15:43

Sklopka: 0/1 ili više

 <input type="checkbox" id="nolunch" /> <input id="checklunch />" $('#nolunch').change(function () { if ($(this).is(':checked')) { $('#checklunch').val('1'); }; if ($(this).is(':checked') == false) { $('#checklunch').val('0'); }; }); 
21
08 янв. odgovor dao user2385302 sij 08 2015-01-08 16:10 '15 u 16:10 2015-01-08 16:10

Koristim ovo:

  <input type="checkbox" id="isAgeSelected" value="1" /> <br/> <input type="textbox" id="txtAge" /> $("#isAgeSelected").is(':checked') ? $("#txtAge").show() : $("#txtAge").hide(); 
19
06 сент. Odgovor daje Nishant Kumar 6. rujna 2013-09-06 09:43 '13 u 9:43 2013-09-06 09:43

Iako ste za svoj problem predložili JavaScript rješenje ( textbox prikazuje kada je checkbox checked ), ovaj se problem može riješiti samo uz pomoć css-a . Ovim pristupom vaš obrazac radi za korisnike koji su onemogućili JavaScript.

Uz pretpostavku da imate sljedeći HTML:

 <label for="show_textbox">Show Textbox</label> <input id="show_textbox" type="checkbox" /> <input type="text" /> 

Možete koristiti sljedeće CSS za postizanje željene funkcionalnosti:

  #show_textbox:not(:checked) + input[type=text] {display:none;} 

U drugim scenarijima možete razmisliti o odgovarajućim CSS selektorima.

Ovdje je skripta koja pokazuje ovaj pristup .

19
22 авг. Odgovor daje Ormoz 22. kolovoza. 2015-08-22 22:09 '15 u 22:09 2015-08-22 22:09
 if($("#checkkBoxId").is(':checked')){ alert("Checked=true"); } 

ili

 if($("#checkkBoxId").attr('checked') == true){ alert("checked=true"); } 
16
10 июня '13 в 16:12 2013-06-10 16:12 odgovor je dao ijarlax 10. lipnja '13 u 16:12 2013-06-10 16:12

Siguran sam da to nije neka vrsta objave, ali nisam vidio sve to u jednom primjeru:

Odabir svih označenih okvira (na stranici):

 $('input[type=checkbox]:checked') 
15
15 нояб. Odgovor je dan Tsonev 15 nov. 2013-11-15 13:50 '13 u 13:50 2013-11-15 13:50
  • 1
  • 2

Ostala pitanja o oznakama ili Postavite pitanje