码迷,mamicode.com
首页 > Web开发 > 详细

jquery实现全选/全不选

时间:2017-06-05 21:05:42      阅读:245      评论:0      收藏:0      [点我收藏+]

标签:body   form   lis   lang   html   bsp   box   src   php   

<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>Document</title>
<script src="./js/jquery.min.js"></script>
</head>
<body>
    <form action="" method="post">
        <input type="checkbox" name="like[]" class="checkList"
            value=<?php echo 111;?>>ball<br> <input type="checkbox" name="like[]"
            class="checkList" value=2>study<br> <input type="checkbox"
            name="like[]" class="checkList" value=3>game<br> <input
            type="checkbox" name="like[]" class="checkAll" value=4>全选/全不选
    </form>
</body>
<script>
$(".checkAll").click(function() {

    var flag1 = $(".checkList").attr("checked") == "checked" ? 1 : 2;
    if (flag1 == 1) {
        window.location.reload();
    }
    
    
    //flag为<input type="checkbox" name="like[]" class="checkAll" value=4>全选/全不选 的标志
    //它全选 flag = 2; 它全不选 flag = 1;
    var flag = $(this).attr("checked") == "checked" ? 1 : 2;

    if (flag == 2) { //全选

        $(this).attr("checked", "checked");
        $(".checkList").attr("checked", "checked");
    } else { //否则全不选
        $(this).removeAttr("checked");
        $(".checkList").removeAttr("checked");
    }

});
</script>
</html>

 

jquery实现全选/全不选

标签:body   form   lis   lang   html   bsp   box   src   php   

原文地址:http://www.cnblogs.com/htmlphp/p/6946939.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!