jQuery操作checkbox选择checked

来源：互联网发布：建筑设计行情知乎编辑：程序博客网时间：2024/05/28 03:03

代码：

?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <script src="Scripts/jquery-1.7.min.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(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(","));
            });
        });
    </script>
</head>
<body>
    <div>
        <input name="chkItem" type="checkbox" value="今日话题" />今日话题
        <input name="chkItem" type="checkbox" value="视觉焦点" />视觉焦点
        <input name="chkItem" type="checkbox" value="财经" />财经
        <input name="chkItem" type="checkbox" value="汽车" />汽车
        <input name="chkItem" type="checkbox" value="科技" />科技
        <input name="chkItem" type="checkbox" value="房产" />房产
        <input name="chkItem" type="checkbox" value="旅游" />旅游
    </div>
    <div>
        <input id="btnCheckAll" type="button" value="全选" />
        <input id="btnCheckNone" type="button" value="全不选" />
        <input id="btnCheckReverse" type="button" value="反选" />
        <input id="btnSubmit" type="button" value="提交" />
    </div>
</body>
</html>

//-------------------------------------tags----------------------------------------------------//
 // 全选
            $("#allid").bind("click", function () {
                $("[name = id_list[]]:checkbox").attr("checked", true);
            });

 // 全不选
            $("#allid2").bind("click", function () {
                $("[name = id_list[]]:checkbox").attr("checked", false);
            });

$("#form_up").submit(function(){
//alert($("[name = id_start]:input").val());
id_start = $("[name = id_start]:input").val();
id_over = $("[name = id_over]:input").val();
if(id_start)
{
if(isNaN(id_start)) 
{
alert('起始id 请填写正确的数字！');
return false;
}
}

if(id_over)
{
if(isNaN(id_over)) 
{
alert('结束id 请填写正确的数字！\n idfaaadsdsfaaf');
return false;
}
}

id_list_len =  $("input[type='checkbox'][name='id_list[]']:checked").length;
if(id_list_len == 0 && !id_start && !id_over)
{
alert('请填写需要更新的id!');
return false;
}

var idall = "";//需要更新的id
if(id_list_len>0)
{
idall+='id: \n(';
$("input[type='checkbox'][name='id_list[]']:checked").each(function(){
idall+=$(this).val()+", ";
});
idall+=')';
//alert($(this).val());
}

if(id_start)
{
idall = idall+' \n 起始id '+id_start;
}
if(id_over)
{
idall = idall+' - 结束id '+id_over;
}

tags = $("input[type = 'text'][name = 'tags']").val();
idall = idall+' \n tags:'+tags;

if(confirm('确定批量更新吗？ \n '+idall))
{
return true;
}
return false;
});

//-------------------------------------tags  结束----------------------------------------------------//