checked全选,全不选

来源:互联网 发布:路基压实度灌砂法软件 编辑:程序博客网 时间:2024/05/30 13:42
<!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>
    <title></title>
    <script type="text/javascript" src="http://img.odream.cn/js/jquery-1.4.4.min.js"></script>
    <script type="text/javascript">
        $(function() {
            //全选
            $("#checkAll").click(function() {
                $("[name='items']:checkbox").attr("checked", true);


            });
            //反选
            $("#checkOpp").click(function() {
                $("[name='items']:checkbox").each(function() {
                    $(this).attr("checked", !$(this).attr("checked"));
                });
            });
            //全不选
            $("#checkNO").click(function() { $("[name='items']:checkbox").attr("checked", false); });


            $("#SubmitID").click(function() {
                var Str = "你选中的是:\n\r";
                $("[name='items']:checkbox:checked").each(function() {
                    Str += $(this).val() + "\n\r";
                });
                alert(Str);
            });


        });
    </script>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /></head>
<body>
    <form>
    <fieldset>
        <legend>你爱好的运动是?</legend>
        <div id="DIV1">
            <input type="checkbox" name="items" value="足球" />足球
            <input type="checkbox" name="items" value="篮球" />篮球
            <input type="checkbox" name="items" value="乒乓球" />兵乓球
            <input type="checkbox" name="items" value="跑步" />跑步
            <input type="checkbox" name="items" value="踢毽子" />踢毽子
            <input type="checkbox" name="items" value="俯卧撑" />俯卧撑
            <input type="checkbox" name="items" value="羽毛球" />羽毛球
        </div>
        <br>
        <input type="button" value="全选" id="checkAll" />
        <input type="button" value="反选" id="checkOpp" />
        <input type="button" value="全不选" id="checkNO" />
        <input type="button" value="取值" id="SubmitID" />
    </fieldset>
    </form>
</body>
</html>
==以下是单单的全选/反选=======================================
<!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>www.k191.com</title>


     <script src="http://img.odream.cn/js/jquery-1.4.4.min.js" type="text/javascript"></script>    <script type="text/javascript">
        $(function() {
            $("#CheckAll").click(function() {
                var flag = $(this).attr("checked");
                $("[name=subBox]:checkbox").each(function() {
                    $(this).attr("checked", flag);
                })
            })
        })
    </script>


</head>
<body>
    <div>
        <input id="CheckAll" type="checkbox" />
        <input name="subBox" type="checkbox" />
        <input name="subBox" type="checkbox" />
        <input name="subBox" type="checkbox" />
        <input name="subBox" type="checkbox" />
    </div>
</body>
</html>