HTML
<div class="form-inline">
<button type="button" class="btn btn-sm" id="calcTotal"><i class="fa fa-dollar"></i>统计</button>
</div>
<!-- 这个是上面的总的复选按钮 -->
<th style="3%;">
<div>
<label><input type="checkbox" name="checkall"></label>
</div>
</th>
<!-- 循环遍历的 -->
<td data-title="选择">
<div>
<label><input type="checkbox" name="checkbox" value="@item.Id"></label>
</div>
</td>
全选,取消全选
神技,prop,这个方法真的非常好用
$('input[name="checkall"]').on("click", function () {
if ($(this).is(':checked')) {
$('input[name="checkbox"]').each(function () {
$(this).prop("checked", true);
});
} else {
$('input[name="checkbox"]').each(function () {
$(this).prop("checked", false);
});
}
});
获取被选中的复选框
$('#calcTotal').on("click", function () {
id = [];
$('input[name="checkbox"]:checked').each(function () {
if ($(this).prop("checked")) {
console.log('选中了' + $(this).val());
id.push($(this).val());
}
})
if (id.length > 0) {
var dellds = id.join(",");
console.log(dellds);
}
});
On和undefined问题
在获取被选中的复选框的时候,如果你是这样写的
$('input:checkbox:checked').each(function () {
那么,你获取的值就会出现on和undefined的问题