最新下载
热门教程
- 1
 - 2
 - 3
 - 4
 - 5
 - 6
 - 7
 - 8
 - 9
 - 10
 
完整的jquery全选/取消全选示例效果
时间:2022-06-25 17:41:21 编辑:袖梨 来源:一聚教程网
由 于这两个比较简单,我就直接上代码吧:
//全选/取消全选
$('#quanxuan').toggle(function () {
    $("input[name='abc']").attr("checked", 'true');
}, function () {
    $("input[name='abc']").removeAttr("checked");
});
//反选
$('#fanxuan').click(function () {
    $("input[name='abc']").each(function () {
        if ($(this).attr("checked")) {
$(this).removeAttr("checked");
        } else {
$(this).attr("checked", 'true');
        }
    });
});
 
再总结一下:
jquery版本在1.3之前时,获取checkbox的选中项的操作:
    $("input[name='abc'][checked]").each(function () {
        alert(this.value);
    });
jquery版本在1.3之后时,获取checkbox的选中项的操作:
    $("input[name='abc']:checked").each(function () {
        alert(this.value);
    });
 
附 完整测试Demo代码:
    //$("input[name='abc'][checked]").each(function () {
    //    alert(this.value);
    //});
    $('#show').html("");
    $("input[name='abc'][checked]").each(function () {
        //alert(this.value);
        $('#show').append(this.value + "  ");
    });
});
//获取选中项
$('#huoqu2').click(function () {
    $('#show').html("");
    $("input[name='abc']:checked").each(function () {
        //alert(this.value);
        $('#show').append(this.value + "  ");
    });
});
//全选/取消全选
$('#quanxuan').toggle(function () {
    $("input[name='abc']").attr("checked", 'true');
}, function () {
    $("input[name='abc']").removeAttr("checked");
});
//反选
$('#fanxuan').click(function () {
    $("input[name='abc']").each(function () {
        if ($(this).attr("checked")) {
$(this).removeAttr("checked");
        } else {
$(this).attr("checked", 'true');
        }
    });
});
        });
    
相关文章
- 三国望神州周仓强度如何 11-04
 - 神迹觉醒宠物有哪些获取途径 11-04
 - 洛克王国世界柴渣虫怎么样 11-04
 - 星塔旅人启明计划如何完成 11-04
 - 碧蓝航线长风技能及装备怎么搭配 11-04
 - 朋友圈谷雨时节唯美文案(精选94句) 11-04