Question

我知道我可以使用以下方法在页面上获得所有选中的复选框：

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

但是我现在在一个页面上使用它，这个页面上有一些我不想包含的其他复选框。如何将上面的代码更改为仅查看具有特定类的复选框？

Answer 1

$('.theClass:checkbox:checked')将为您提供课程theClass的所有选中复选框。

Answer 2

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

An example 来演示。

:checkbox是复选框的选择器（实际上，你可以省略选择器的input部分，虽然我发现了在早期版本的库中你会得到奇怪结果的小众案例我确定它们已在以后的版本中修复了。 .class是包含class的元素类属性的选择器。

Answer 3

强制性.map示例：

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

Answer 4

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

这将获得类名“yourClass”的所有复选框。我喜欢这个例子，因为它使用jQuery选择器 checked 而不是进行条件检查。我个人也会使用数组存储值，然后根据需要使用它们，如：

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

Answer 5

如果您需要将所有选中复选框的值作为数组：

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

Answer 6

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

Answer 7

我不确定它是否对您的特定情况有帮助，而且我不确定在您的情况下，您想要包含的复选框是否只是单个表单或div或表的一部分，但您始终可以选择特定元素内的所有复选框。例如：

<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>

然后，使用以下jQuery，它只会通过id =“selective”的UL中的复选框：

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

Answer 8

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

请参阅jQuery class selectors。

Answer 9

将所有值都放入数组的简单方法

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

})();

console.log(valores);

Answer 10

您可以使用以下内容：
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")

它将选择1和3的值。

Answer 11

<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

Answer 12

我知道这个问题已经有了很多很好的答案但我在浏览时发现了这个问题，我觉得它很容易使用。以为我会分享给其他人看。

<强> 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);
    });
});

<强>参考： Easiest "Check All" with jQuery

Answer 13

您可以尝试这样

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

Answer 14

export default [ 
    {
        path: '/child',
        component: () => import ('@/app/modules/root'), <-- Just verify this path,
        children: ...
    }
]

Answer 15

HTML

 <p> <input type="checkbox" name="fruits" id="fruits"  value="1" /> Apple </p>
 <p> <input type="checkbox" name="fruits" id="fruits"  value="2" /> Banana </p>
 <p> <input type="checkbox" name="fruits" id="fruits"  value="3" /> Mango </p>
 <p> <input type="checkbox" name="fruits" id="fruits"  value="4" /> Grape </p>

jQuery

用于存储选定的水果值定义数组。

 fruitArray = [];

$。每个都会迭代选中的复选框并放入数组。

 $.each($("input[name='fruits']:checked"), function (K, V) {    
    fruitArray.push(V.value);        
});

Answer 16

一种通过类名获取选中的复选框的ID的简单方法：

$(".yourClassName:checkbox:checked").each(function() {
     console.log($(this).attr("id"));
});

Answer 17

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

使用jquery获取具有特定类名的所有选中复选框

17 个答案: