JQ checkbox 全选 反选获取值

来源:互联网 发布:高仿球鞋的淘宝店 编辑:程序博客网 时间:2024/05/17 22:35
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
        <script type="text/javascript" src="js/jquery-2.1.4.min.js"></script>
</head>
<body>
<form name="myform" action="#" method="post">
<input class="select" type="checkbox" name="check[]" value="1" "/>1<p/>
<input class="select" type="checkbox" name="check[]" value="2" "/>2<p/>
<input class="select" type="checkbox" name="check[]" value="3" "/>3<p/>
<input class="select" type="checkbox" name="check[]" value="4" "/>4<p/>
<input class="select" type="checkbox" name="check[]" value="5" "/>5<p/>
<input type="checkbox"  id="selectall"/>全选
<input type="checkbox"  id="selectanone"/>全不选
<input type="checkbox"  id="selectfan"/>反选<p/>
<input type="submit" name="submit"></button>
</form>
        <div></div>
<script type="text/javascript">
$(document).ready(function(){
          //全选 
            $("#selectall").click(function () { 
            if(this.checked==true){
                    $(".select").attr("checked", true);              
            }else{
            $(".select").attr("checked", false);  
            };
            });  
            //全不选 
            $("#selectanone").click(function () { 
                $(".select").attr("checked", false);  
            });  
            //反选
            $("#selectfan").click(function () {  
                $(".select").each(function () {  
                    this.checked=!this.checked;
                });  
            }); 
           //获取值
           $("input[type='submit']").click(function(){
               var checkvalue=[];
               $(".select:checked").each(function(){
               checkvalue.push($(this).val());
               });
               alert(checkvalue);
//            $("div").html(checkvalue);
           });
});


</script>
</body>
</html>;
0 0
原创粉丝点击