全选功能

最新推荐文章于 2024-09-22 11:17:00 发布

weixin_30367945

最新推荐文章于 2024-09-22 11:17:00 发布

阅读量54

点赞数

文章标签： javascript ViewUI

原文链接：http://www.cnblogs.com/huangqiming/p/6113866.html

版权

1、jquery+JavaScript的全选功能

$(document).on("click",".all",function(){
		 if(this.checked){
			 $("#tbody1 :checkbox").each(function(i,n){
	                $(n).prop('checked',true);
	            });
	        }else{
	        	$("#tbody1 :checkbox").each(function(i,n){
	                $(n).prop('checked',false);
	            });
	        }
	})
	$(document).on("click","#tbody1 :checkbox",function(){
		allchk();
	})
    function allchk(){
        var chknum = $("#tbody1 :checkbox").length;//选项总个数
        var chk = 0;
        $("#tbody1 :checkbox").each(function () {
            if($(this).prop("checked")==true){
                chk++;
            }
        });
        if(chknum==chk){//全选
            $(".all").prop('checked',true);
        }else{//不全选
            $(".all").prop('checked',false);
        }
    }

　　2、更为简便的全选功能

$(function(){
   $(".all").click(function(e){
     $("tbody:checkbox").prop("checked",this.checked);
   })

   $("tbody:checkbox").click(function(){
     if($("tbody:checkbox").length==$("tbody:checked").length){
         $(".all").prop("checked",true);
     }else{
         $(".all").prop("checked",false);
     }
   }) 
})

转载于:https://www.cnblogs.com/huangqiming/p/6113866.html