使用jquery获得所有选中的复选框与特定的类名

小开

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

小开

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

示例 . sh 来演示。

:checkbox是复选框的选择器(事实上，你可以省略选择器的input部分，尽管我发现在较早版本的库中这样做会得到奇怪的结果。我相信它们在后来的版本中得到了修复)。 .class是包含class的元素类属性的选择器

小开

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

看到jQuery类选择器。

小开

最佳答案

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

小开

强制的.map示例:

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

小开

我不确定它是否对您的特定情况有帮助，我也不确定在您的情况下，您想要包含的复选框是否都是单个表单或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() : "");
});

小开

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

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

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

小开

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

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

< >强引用: 最简单的“检查所有”与jQuery

小开

如果你需要以数组形式获取所有选中的复选框的值:

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

小开

获取所有值到数组的简单方法

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


})();


console.log(valores);

小开

<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

小开

你可以这样使用:
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。

小开

你可以这样试试

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

小开

$(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()

小开

超文本标记语言

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

小开

一个通过类名获取选中复选框id的简单方法:

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

小开

$("input:checked.yourClassName").each(function(){
console.log($(this).val());
});

这也是工作。