1 <input type="checkbox" id="all" />全选<br />
2 <input type="checkbox" name="sub" />image1.jpg<br />
3 <input type="checkbox" name="sub"/>image2.jpg<br />
4 <input type="checkbox" name="sub"/>image3.jpg<br />
5 <input type="checkbox" name="sub"/>image4.jpg<br />
6 <script type="text/javascript">
7 $(function() {
8 $(\'#all\').on(\'click\',function(){
9 if(this.checked) {
10 $("input[name=\'sub\']").attr(\'checked\',true);
11 }else {
12 $("input[name=\'sub\']").attr(\'checked\',false);
13 }
14 });
15 });
16 </script>
用这个方法，在实现全选和取消全选中遇到了一个问题(这个问题出现在用jquery等动态添加内容时，点击全选后，再次点击取消全选，再次点击全选就不管用了，代码是这样的：
1 $("#left").append(
2 "<span>" + "全选" + "</span>" + "<input type=\"checkbox\" name=\"all\" id=\"all\">");
3 $.each(json.filelist,function(i, item) {
4 $("#left").append(
5 "<span>" + item.name + "</span>" + "<input type=\"checkbox\" name=\"sub\">" + "</br>");
});
在这种情况下，我又找到另外一种方法：
1 $("#all").on(\'click\',function() {
2 $("input[name=\'sub\']").prop("checked", this.checked);
3 });
4
5 $("input[name=\'sub\']").on(\'click\',function() {
6 var $subs = $("input[name=\'sub\']");
7 $("#all").prop("checked" , $subs.length == $subs.filter(":checked").length ? true :false);
8 });
推荐使用on绑定点击事件，因为on事件也适用于动态加载的元素