- <!DOCTYPE html>
- <html lang="en">
- <head>
- <meta charset="UTF-8">
- <title>Document</title>
- <script type="text/javascript" src1="http://libs.baidu.com/jquery/1.10.2/jquery.min.js"></script>
- <script type="text/javascript">
- $(function(){
- var checkbox = $('input[name=checkbox]');
- $('.selectAll').on("click",function(){
- checkbox.prop('checked', this.checked);
- });
- checkbox.on("click",function(){
- var _tmp = checkbox;
- $(".selectAll").prop('checked',_tmp.length == _tmp.filter(":checked").length);
- });
- //或者使用下述方法
- // checkbox.on("click",function(){
- // var flag = true;
- // checkbox.each(function(){
- // if (!this.checked) {
- // flag = false;
- // };
- // })
- // if (flag) {
- // $('.selectAll').prop('checked', true)
- // }else{
- // $('.selectAll').prop('checked', false)
- // }
- // })
- })
- </script>
- </head>
- <body>
- <input type="checkbox" class="selectAll">全选/全不选<br/>
- <input type="checkbox" name="checkbox" /><br/>
- <input type="checkbox" name="checkbox" /><br/>
- <input type="checkbox" name="checkbox" /><br/>
- <input type="checkbox" name="checkbox" /><br/>
- <input type="checkbox" name="checkbox" /><br/>
- <input type="checkbox" name="checkbox" /><br/>
- </body>
- </html>
- //该片段来自于http://www.codesnippet.cn/detail/0307201513000.html
来源: http://www.codesnippet.cn/detail/0307201513000.html