jQuery melihat apakah ada atau tidak ada kotak centang yang dipilih

126

Saya tahu cara melihat apakah kotak centang dipilih atau tidak.

Tapi saya mengalami masalah dengan yang berikut - diberikan id formulir saya perlu melihat apakah ada kotak centang yang dipilih (yaitu 1 atau lebih), dan saya perlu melihat apakah tidak ada yang dipilih. Pada dasarnya saya membutuhkan dua fungsi terpisah yang menjawab dua pertanyaan ini. Bantuan akan dihargai. Terima kasih!

Sebenarnya, saya hanya perlu fungsi untuk memberi tahu saya jika tidak ada yang dipilih. Mengetahui hal ini akan menjawab pertanyaan lain.

bba
sumber

Jawaban:

246

Anda dapat menggunakan sesuatu seperti ini

if ($("#formID input:checkbox:checked").length > 0)
{
    // any one is checked
}
else
{
   // none is checked
}
rahul
sumber
8
$("#formID input:checkbox:checked").lengthakan cukup di sini juga
Damon
@Damon Saya kira maksud Anda if ($("#formID input:checkbox:checked").length){}(tanpa >0) akan cukup karena 0 adalah nilai falsey, lihat james.padolsey.com/javascript/truthy-falsey
Adrien Be
11
jQuery mengatakan mengenai :checkboxpemilih :,For better performance in modern browsers, use [type="checkbox"] lihat api.jquery.com/checkbox-selector - sama untuk radiobuttons btw, use [type="radio"] rather than :radio api.jquery.com/radio-selector
Adrien Be
27

JQuery .isakan menguji semua elemen yang ditentukan dan mengembalikan true jika setidaknya salah satu dari mereka cocok dengan pemilih:

if ($(":checkbox[name='choices']", form).is(":checked"))
{
    // one or more checked
}
else
{
    // nothing checked
}
Michael Logutov
sumber
Meskipun is()tampaknya berfungsi, memiliki :checkedlangsung di pemilih seperti yang ditunjukkan dalam jawaban @ rahul tampaknya lebih tepat. is () tampaknya lebih bermanfaat ketika "di dalam panggilan balik", lihat api.jquery.com/is . Atau apakah saya melewatkan sesuatu?
Adrien Be
Tidak, cukup banyak yang tertulis dalam dokumen - Anda memeriksa apakah suatu elemen cocok dengan atribut yang ditentukan. Menerapkannya sebagai filter dan kemudian memeriksa apakah Anda mendapatkan setidaknya satu item dalam hasil adalah sama tetapi lebih lama dan tidak begitu ekspresif.
Michael Logutov
Memberi +1 untuk fakta bahwa .is(":checked")dalam solusi Anda lebih ekspresif, tidak yakin tentang sisanya.
Adrien Be
Yaitu $("form input[type=checkbox]").is(":checked")mungkin pendekatan yang lebih sederhana & lebih umum.
Adrien Be
@AdrienBe Menggunakan ismungkin kinerja yang lebih baik, karena berhenti segera setelah menemukannya.
ChrisW
8

Kamu bisa melakukan ini:

  if ($('#form_id :checkbox:checked').length > 0){
    // one or more checkboxes are checked
  }
  else{
   // no checkboxes are checked
  }

Dimana:

  • :checkbox filter selector memilih semua kotak centang.
  • :checked akan memilih kotak centang yang dicentang
  • length akan memberikan jumlah yang diperiksa di sana
Sarfraz
sumber
jQuery mengatakan mengenai :checkboxpemilih :,For better performance in modern browsers, use [type="checkbox"] lihat api.jquery.com/checkbox-selector
Adrien Be
6

Ini yang saya gunakan untuk memeriksa apakah ada kotak centang dalam daftar kotak centang telah berubah:

$('input[type="checkbox"]').change(function(){ 

        var itemName = $('select option:selected').text();  

         //Do something.

});     
James Drinkard
sumber
6

Tanpa menggunakan 'panjang' Anda bisa melakukannya seperti ini:

if ($('input[type=checkbox]').is(":checked")) {
      //any one is checked
}
else {
//none is checked
}
Acheme Paul
sumber
3

Anda dapat melakukan pengembalian sederhana di .lengthsini:

function areAnyChecked(formID) {
  return !!$('#'+formID+' input[type=checkbox]:checked').length;
}

Ini mencari kotak centang dalam bentuk yang diberikan, melihat apakah ada :checkeddan kembali truejika mereka (karena panjangnya akan 0 sebaliknya). Untuk membuatnya sedikit lebih jelas, inilah versi yang dikonversi non boolean:

function howManyAreChecked(formID) {
  return $('#'+formID+' input[type=checkbox]:checked').length;
}

Ini akan menghasilkan hitungan berapa banyak yang diperiksa.

Nick Craver
sumber
3

Jawaban Rahul paling cocok untuk pertanyaan Anda. Lagi pula, jika Anda memiliki sekelompok kotak centang untuk diperiksa dan tidak semua kotak centang dalam formulir Anda, Anda dapat melakukannya.

Masukkan nama kelas untuk semua kotak centang yang ingin Anda periksa, katakan misalnya, nama kelas test_checkdan sekarang Anda dapat memeriksa apakah ada kotak centang yang dicentang milik grup dengan:

$("#formID .test_check:checked").length > 0

Jika kembali true, asumsikan bahwa satu atau lebih kotak centang dicentang memiliki nama kelas test_checkdan tidak ada yang diperiksa jika kembali false.

Semoga ini bisa membantu seseorang. Terima kasih :)

Rajesh Omanakuttan
sumber
1

Ini adalah cara terbaik untuk menyelesaikan masalah ini.

  if($("#checkbox").is(":checked")){

  // Do something here /////

  };
Asiamah Amos
sumber
Hai, selamat datang di StackOverflow. Mungkin Anda dapat menjelaskan jawaban Anda sedikit lebih banyak, karena tidak jelas mengapa itu adalah "cara terbaik" untuk menyelesaikan masalah.
dddJewelsbbb