jquery:实现全选和取消全选

<input type="checkbox" id="all" />全选<br /> 
<input type="checkbox" name="sub" />image1.jpg<br /> 
<input type="checkbox" name="sub"/>image2.jpg<br /> 
<input type="checkbox" name="sub"/>image3.jpg<br /> 
<input type="checkbox" name="sub"/>image4.jpg<br /> 
<script type="text/javascript">
　　$(function() { 
　　　　$('#all').on('click',function(){
　　　　　　if(this.checked) {
　　　　　　　　$("input[name='sub']").attr('checked',true);
　　　　　　}else {
　　　　　　　　$("input[name='sub']").attr('checked',false);
　　　　　　}
　　　　});
　　}); 
</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事件也适用于动态加载的元素