浪柱娱乐
您的当前位置:首页jQuery操作checkbox选择(list/table)_jquery

jQuery操作checkbox选择(list/table)_jquery

来源:浪柱娱乐


1、checkbox list选择

效果图:

代码:
代码如下:






$(function () {
// 全选
$("#btnCheckAll").bind("click", function () {
$("[name = chkItem]:checkbox").attr("checked", true);
});
// 全不选
$("#btnCheckNone").bind("click", function () {
$("[name = chkItem]:checkbox").attr("checked", false);
});
// 反选
$("#btnCheckReverse").bind("click", function () {
$("[name = chkItem]:checkbox").each(function () {
$(this).attr("checked", !$(this).attr("checked"));
});
});
// 全不选
$("#btnSubmit").bind("click", function () {
var result = new Array();
$("[name = chkItem]:checkbox").each(function () {
if ($(this).is(":checked")) {
result.push($(this).attr("value"));
}
});
alert(result.join(","));
});
});




今日话题
视觉焦点
财经
汽车
科技
房产
旅游










2、checkbox table选中

效果图:

代码:
代码如下:







$(function () {
// chkAll全选事件
$("#chkAll").bind("click", function () {
$("[name = chkItem]:checkbox").attr("checked", this.checked);
});
// chkItem事件
$("[name = chkItem]:checkbox").bind("click", function () {
var $chk = $("[name = chkItem]:checkbox");
$("#chkAll").attr("checked", $chk.length == $chk.filter(":checked").length);
})
});











































分类名称



今日话题



视觉焦点



财经



汽车



科技



房产



旅游



显示全文