Answers:
$('.theClass:checkbox:checked')
将为您提供该类所有选中的复选框theClass
。
$('input:checkbox.class').each(function () {
var sThisVal = (this.checked ? $(this).val() : "");
});
一个例子来说明。
:checkbox
是复选框的选择器(实际上,您可以省略input
选择器的一部分,尽管我发现在特殊情况下,在库的早期版本中这样做会得到奇怪的结果。我敢肯定它们在更高版本中已得到修复)。
.class
是包含的元素类属性的选择器class
。
强制性.map
示例:
var checkedVals = $('.theClass:checkbox:checked').map(function() {
return this.value;
}).get();
alert(checkedVals.join(","));
on,on
结果(选中的每个复选框均“打开”)
$('input.yourClass:checkbox:checked').each(function () {
var sThisVal = $(this).val();
});
这将获得类名称为“ yourClass”的所有复选框。我喜欢这个例子,因为它使用jQuery选择检查做条件检查代替。我个人也将使用数组存储值,然后根据需要使用它们,例如:
var arr = [];
$('input.yourClass:checkbox:checked').each(function () {
arr.push($(this).val());
});
.map
可能是一个更令人愉快的选择,如karim79的答案所示。
如果需要将所有选中的复选框的值作为数组获取:
let myArray = (function() {
let a = [];
$(".checkboxes:checked").each(function() {
a.push(this.value);
});
return a;
})()
我不确定它是否对您的特定情况有用,也不确定您要包括的复选框是否仅属于单个表单,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.myclass[type=checkbox]').each(function () {
var sThisVal = (this.checked ? $(this).val() : ""); });
参见jQuery类选择器。
您可以使用如下代码:
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。
将所有值都放入数组的简单方法
var valores = (function () {
var valor = [];
$('input.className[type=checkbox]').each(function () {
if (this.checked)
valor.push($(this).val());
});
return valor;
})();
console.log(valores);
你可以这样尝试
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>
我知道这已经对这个问题有很多很好的答案,但是我在浏览时发现了这个问题,并且发现它真的很容易使用。以为我会与其他任何人分享。
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);
});
});
$("input[name='<your_name_of_selected_group_checkboxes>']:checked").val()
class
而不是说name
吗?