jQuery表格数据条件筛选代码

jQuery表格数据条件筛选代码-精品资源网
jQuery表格数据条件筛选代码
此内容为免费资源,请登录后查看
0
免费资源

jQuery表格数据条件筛选代码

一款实用的jQuery表格数据条件筛选代码,点击筛选按钮弹出设置窗口,根据需要进行勾选来显示表格数据。

js代码

<script type=\"text/javascript\">
$(function(){
//要绑定的表格类名
var choosetable=\".choosetable\";

var checkarray=[];
	//循环遍历table的th加入到筛选列表中
	$(choosetable+\" th\").each(function(){
		checkarray.push($(this).text());
	});
	for (var i = 0; i < checkarray.length/3; i++) {
		if(i<checkarray.length/3-1||checkarray.length%3==0){
			var checktext=\"\";
			for (var j = 0; j < 3; j++) {
			 checktext+=\"<div class=\'choosediv\'><label class=\'checkbox\'><input type=\'checkbox\' checked value=\'\"+((i*3)+j)+\"\'> \"+checkarray[((i*3)+j)]+\" </label> </div>\";
		 }
	 }else{
		var checktext=\"\";
		for (var j = 0; j <checkarray.length%3; j++) {
		 checktext+=\"<div class=\'choosediv\'><label class=\'checkbox\'><input type=\'checkbox\' checked value=\'\"+((i*3)+j)+\"\'> \"+checkarray[((i*3)+j)]+\" </label> </div>\";
	 }   
 }
 $(\".modal-body\").append(\"<div class=\'chooses\'>\"+checktext+\"</div>\");
}

$(\"#choosebtn\").click(function(){
var choosearr=[];
$(\".checkbox input\").each(function(){
			//alert($(this).is(\":checked\"));
			if(!$(this).is(\":checked\")){
				choosearr.push($(this).val());
			}
		})
		//alert(choosearr);
		$(choosetable+\" tr\").each(function(){
		   $(this).children().show();
	   });
		for(var i=0;i<choosearr.length;i++){

			$(choosetable+\" tr\").each(function(){
				$(this).children().eq(choosearr[i]).hide();
			});
			
		}
	});
	//全选/全不选
	$(\"#allchecked\").click(function(){
		if(this.checked){   
			$(\".checkbox input\").prop(\"checked\", true);  
		}else{   
			$(\".checkbox input\").prop(\"checked\", false);
		} 
	});  
})

</script>

© 版权声明
THE END
点赞0 分享
评论 抢沙发
头像
欢迎您留下宝贵的见解!
提交
头像

昵称

取消
昵称表情代码图片

    暂无评论内容