Menggunakan jquery untuk memeriksa semua kotak centang dengan nama kelas tertentu

Saya tahu saya bisa memeriksa semua kotak centang pada halaman menggunakan ini:

$('input[type=checkbox]').each(function () {
    var sThisVal = (this.checked ? $(this).val() : "");
});

Tetapi saya sekarang menggunakan ini pada halaman yang memiliki beberapa kotak centang lain yang tidak ingin saya sertakan. Bagaimana saya mengubah kode di atas untuk hanya melihat kotak centang dicentang yang memiliki kelas tertentu pada mereka?

$('.theClass:checkbox:checked')akan memberi Anda semua kotak centang yang dicentang dengan kelas theClass.

$('input:checkbox.class').each(function () {
       var sThisVal = (this.checked ? $(this).val() : "");
  });

Contoh untuk ditunjukkan.

:checkboxadalah pemilih untuk kotak centang (pada kenyataannya, Anda bisa menghilangkan inputbagian dari pemilih, meskipun saya menemukan kasus khusus di mana Anda akan mendapatkan hasil aneh melakukan ini di versi perpustakaan sebelumnya. Saya yakin mereka diperbaiki di versi yang lebih baru). .classadalah pemilih untuk atribut kelas elemen yang mengandung class.

.mapContoh wajib :

var checkedVals = $('.theClass:checkbox:checked').map(function() {
    return this.value;
}).get();
alert(checkedVals.join(","));

$('input.yourClass:checkbox:checked').each(function () {
    var sThisVal = $(this).val();
});

Ini akan mendapatkan semua kotak centang dari nama kelas "yourClass". Saya suka contoh ini karena menggunakan pemilih jQuery diperiksa daripada melakukan pemeriksaan bersyarat. Secara pribadi saya juga akan menggunakan array untuk menyimpan nilai, kemudian menggunakannya sesuai kebutuhan, seperti:

var arr = [];
$('input.yourClass:checkbox:checked').each(function () {
    arr.push($(this).val());
});

Jika Anda perlu mendapatkan nilai dari semua kotak centang yang dicentang sebagai array:

let myArray = (function() {
    let a = [];
    $(".checkboxes:checked").each(function() {
        a.push(this.value);
    });
    return a;
})()

 $('input.theclass[type=checkbox]').each(function () {
   var sThisVal = (this.checked ? $(this).val() : "");
 });

Saya tidak yakin apakah itu membantu untuk kasus khusus Anda, dan saya tidak yakin jika dalam kasus Anda, kotak centang yang ingin Anda sertakan hanya semua adalah bagian dari satu formulir atau div atau tabel, tetapi Anda selalu dapat memilih semua kotak centang di dalam elemen tertentu. Sebagai contoh:

<ul id="selective">
 <li><input type="checkbox" value="..." /></li>
 <li><input type="checkbox" value="..." /></li>
 <li><input type="checkbox" value="..." /></li>
 <li><input type="checkbox" value="..." /></li>
</ul>

Kemudian, menggunakan jQuery berikut, HANYA melewati kotak centang dalam UL dengan id = "selective":

$('#selective input:checkbox').each(function () {
 var sThisVal = (this.checked ? $(this).val() : "");
});

 $('input.myclass[type=checkbox]').each(function () {
   var sThisVal = (this.checked ? $(this).val() : ""); });

Lihat pemilih kelas jQuery .

Anda dapat menggunakan sesuatu seperti ini:
HTML:

<div><input class="yourClass" type="checkbox" value="1" checked></div>
<div><input class="yourClass" type="checkbox" value="2"></div>
<div><input class="yourClass" type="checkbox" value="3" checked></div>
<div><input class="yourClass" type="checkbox" value="4"></div>

JQuery:

$(".yourClass:checkbox").filter(":checked")

Ini akan memilih nilai 1 dan 3.

Cara sederhana untuk memasukkan semua nilai ke dalam array

var valores = (function () {
    var valor = [];
    $('input.className[type=checkbox]').each(function () {
        if (this.checked)
            valor.push($(this).val());
    });
    return valor;

})();

console.log(valores);

Anda bisa coba seperti ini

let values = (function() {
                let a = [];
                $(".chkboxes:checked").each(function() {
                    a.push($(this).val());
                });
                return a;
            })();

<input type="checkbox" id="Checkbox1" class = "chk" value = "1" />
<input type="checkbox" id="Checkbox2" class = "chk" value = "2" />
<input type="checkbox" id="Checkbox3" class = "chk" value = "3" />
<input type="checkbox" id="Checkbox4" class = "chk" value = "4" />
<input type="button" id="demo" value = "Demo" />

<script type = "text/javascript" src = "http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.6.1.min.js"></script>
<script type="text/javascript">
    $("#demo").live("click", function () {
        $("input:checkbox[class=chk]:checked").each(function () {
            alert("Id: " + $(this).attr("id") + " Value: " + $(this).val());
        });
    });
</script>

http://www.jqueryfaqs.com/Articles/Get-values-of-all-checked-checkboxes-by-class-name-using-jQuery.aspx

Saya tahu ini sudah memiliki banyak jawaban yang bagus untuk pertanyaan ini, tetapi saya menemukan ini saat browsing dan saya merasa sangat mudah digunakan. Kupikir aku akan berbagi untuk orang lain yang mencari.

HTML:

<fieldset>
    <!-- these will be affected by check all -->
    <div><input type="checkbox" class="checkall"> Check all</div>
    <div><input type="checkbox"> Checkbox</div>
    <div><input type="checkbox"> Checkbox</div>
    <div><input type="checkbox"> Checkbox</div>
</fieldset>
<fieldset>
    <!-- these won't be affected by check all; different field set -->
    <div><input type="checkbox"> Checkbox</div>
    <div><input type="checkbox"> Checkbox</div>
    <div><input type="checkbox"> Checkbox</div>
</fieldset>

jQuery:

$(function () {
    $('.checkall').on('click', function () {
        $(this).closest('fieldset').find(':checkbox').prop('checked', this.checked);
    });
});

Referensi: "Periksa Semua" yang termudah dengan jQuery

$(document).ready(function(){
    $('input.checkD[type="checkbox"]').click(function(){
        if($(this).prop("checked") == true){
            $(this).val('true');
        }
        else if($(this).prop("checked") == false){
            $(this).val('false');
        }
    });
});

$("input[name='<your_name_of_selected_group_checkboxes>']:checked").val()