jQuery: Uji apakah kotak centang TIDAK dicentang

Saya kesulitan mencari tahu. Saya memiliki dua kotak centang (di masa mendatang akan memiliki lebih banyak):

• checkSurfaceEnvironment-1
• checkSurfaceEnvironment-2

Pada dasarnya, saya ingin menulis pernyataan if dan menguji apakah salah satunya dicentang dan yang lain TIDAK dicentang. Apa cara termudah untuk mencapai hal berikut:

if ( $("#checkSurfaceEnvironment-1").attr('checked', true) &&
     $("#checkSurfaceEnvironment-2").is('**(NOT??)** :checked') ) {
        // do something
}

Salah satu cara andal yang saya gunakan adalah:

if($("#checkSurfaceEnvironment-1").prop('checked') == true){
    //do something
}

Jika Anda ingin mengulang elemen yang dicentang gunakan elemen induk

$("#parentId").find("checkbox").each(function(){
    if ($(this).prop('checked')==true){ 
        //do something
    }
});

Info lebih lanjut:

Ini bekerja dengan baik karena semua kotak centang memiliki properti yang diperiksa yang menyimpan status kotak centang yang sebenarnya. Jika ingin, Anda dapat memeriksa halaman dan mencoba untuk memeriksa dan menghapus centang pada kotak centang, dan Anda akan melihat atribut "diperiksa" (jika ada) akan tetap sama. Atribut ini hanya mewakili status awal kotak centang, dan bukan status saat ini . Status saat ini disimpan dalam properti yang diperiksa dari elemen dom untuk kotak centang itu.

Lihat Properti dan Atribut di HTML

if (!$("#checkSurfaceEnvironment-1").is(":checked")) {
    // do something if the checkbox is NOT checked
}

Anda juga dapat menggunakan .not()metode jQuery atau :not()selector:

if ($('#checkSurfaceEnvironment').not(':checked').length) {
    // do stuff for not selected
}

Contoh JSFiddle

catatan tambahan

Dari dokumentasi jQuery API untuk :not() selector :

The .not () metode akan berakhir menyediakan Anda dengan pilihan dibaca lebih dari mendorong penyeleksi kompleks atau variabel menjadi : tidak () pemilih filter. Dalam banyak kasus, ini adalah pilihan yang lebih baik.

Cara alternatif:

Berikut adalah contoh kerja dan ini kodenya, Anda juga harus menggunakan prop.

$('input[type="checkbox"]').mouseenter(function() { 
    if ($(this).is(':checked')) {
        //$(this).prop('checked',false);
        alert("is checked");
    } else {
         //$(this).prop('checked',true);
        alert("not checked");
    }
});​

Saya mengomentari cara mengaktifkan atribut yang dicentang.

if ( $("#checkSurfaceEnvironment-1").is(":checked") && $("#checkSurfaceEnvironment-2").not(":checked") )

Saya mencari implementasi yang lebih langsung seperti yang disarankan avijendr.

Saya mengalami sedikit masalah dengan sintaksnya, tetapi saya membuat ini berfungsi:

if ($('.user-forms input[id*="chkPrint"]:not(:checked)').length > 0)

Dalam kasus saya, saya memiliki meja dengan kelas user-forms, dan aku sedang memeriksa jika ada kotak centang yang memiliki string checkPrintdi mereka idyang dicentang.

Saya pikir cara termudah (dengan jQuery) untuk memeriksa apakah kotak centang dicentang atau TIDAK adalah:

jika 'dicentang':

if ($(this).is(':checked')) {
// I'm checked let's do something
}

jika TIDAK 'dicentang':

if (!$(this).is(':checked')) {
// I'm NOT checked let's do something
}

Di sini saya memiliki potongan untuk pertanyaan ini.

$(function(){
   $("#buttoncheck").click(function(){
        if($('[type="checkbox"]').is(":checked")){
            $('.checkboxStatus').html("Congratulations! "+$('[type="checkbox"]:checked').length+" checkbox checked");
        }else{
            $('.checkboxStatus').html("Sorry! Checkbox is not checked");
         }
         return false;
   })
    
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form>
  <p>
    <label>
      <input type="checkbox" name="CheckboxGroup1" value="checkbox" id="CheckboxGroup1_0">
      Checkbox</label>
    <br>
    <label>
      <input type="checkbox" name="CheckboxGroup1_" value="checkbox" id="CheckboxGroup1_1">
      Checkbox</label>
    <br>
  </p>
  <p>
    <input type="reset" value="Reset">
    <input type="submit" id="buttoncheck" value="Check">
  </p>
  <p class="checkboxStatus"></p>
</form>

Untuk melakukannya dengan .attr()seperti yang Anda miliki, untuk melihat apakah itu dicentang .attr("checked", "checked"), dan jika tidak, itu akan terjadi.attr("checked") == undefined

Kembalikan nilai true jika semua checbox dicentang dalam div

function all_checked (id_div){
 all_checked = true;

 $(id_div+' input[type="checkbox"]').each(function() { 
    all_checked = all_checked && $('this').prop('checked');
 }

 return all_checked;
}

Sederhana dan mudah untuk memeriksa atau kondisi tidak dicentang

<input type="checkbox" id="ev-click" name="" value="" >

<script>
    $( "#ev-click" ).click(function() {
        if(this.checked){
            alert('checked');
        }
        if(!this.checked){
            alert('Unchecked');
        }
    });
</script>

coba yang ini

if ($("#checkSurfaceEnvironment-1:checked").length>0) {
    //your code in case of NOT checked
}

Dalam kode di atas memilih elemen dengan Id (#checkSurfaceEnvironment-1)kemudian menyaring status yang diperiksa oleh (:checked)filter.

Ini akan mengembalikan array objek elemen yang dicentang. Jika ada objek yang ada dalam array maka kondisi if akan terpenuhi.

Ada dua cara untuk memeriksa kondisi.

if ($("#checkSurfaceEnvironment-1").is(":checked")) {
    // Put your code here if checkbox is checked
}

ATAU Anda juga bisa menggunakan yang ini

if($("#checkSurfaceEnvironment-1").prop('checked') == true){
    // Put your code here if checkbox is checked
}

Semoga bermanfaat untuk anda.

Berikut adalah cara termudah yang diberikan

 <script type="text/javascript">

        $(document).ready(function () {
            $("#chk_selall").change("click", function () {

                if (this.checked)
                {
                    //do something
                }
                if (!this.checked)
                {
                    //do something

                }

            });

        });

    </script>

Saya menggunakan ini dan bekerja untuk saya!

$("checkbox selector").click(function() {
    if($(this).prop('checked')==true){
       do what you need!
    }
});

Saya tahu ini sudah dijawab, tetapi tetap saja, ini cara yang baik untuk melakukannya:

if ($("#checkbox").is(":checked")==false) {
    //Do stuff here like: $(".span").html("<span>Lorem</span>");
}

if($("#checkbox1").prop('checked') == false){
    alert('checkbox is not checked');
    //do something
}
else
{ 
    alert('checkbox is checked');
}

$("#chkFruits_0,#chkFruits_1,#chkFruits_2,#chkFruits_3,#chkFruits_4").change(function () {
        var item = $("#chkFruits_0,#chkFruits_1,#chkFruits_2,#chkFruits_3,#chkFruits_4");
    if (item.is(":checked")==true) {
        //execute your code here
    }

    else if (item.is(":not(:checked)"))
    {
        //execute your code here
    }

});