火神大我_莫的博客

加油吧,骚年~

checkbox框的各种状态选择

首先是画面上的效果


      




js中的实现逻辑

/**
 * 选择框点击事件
 */
function checkBoxClick(){
	var _this = $(this); //获取当前对象的jquery对象
	var _parent = _this.parent().parent(); //获取当前对象父父的jquery对象
	if(!_parent.hasClass("operate")){ //如果不是全选box的话
		var _len1 = $(".detail input[type='checkbox']").length; //①取得detail下的checkbox个数①
		var _len2 = $(".detail input:checked").length;	//②取得当前选中的checkbox个数
		if(_len1 == _len2){	//①=②
			$(".operate input[type='checkbox']").prop("checked",true);  //operate中的全选box设置为选中状态
		} else {
			$(".operate input[type='checkbox']").prop("checked",false);	//operate中的全选box设置为非选中状态
		}
	} else {	//如果是全选box的话
		if(_this.is(":checked")){//同时是选中状态的话
			$(".detail input[type='checkbox']").prop("checked",true);//把所有的detail下的checkbox选中
		} else {
			$(".detail input[type='checkbox']").prop("checked",false);//把所有的detail下的checkbox不选中
		}
	}
}


阅读更多
版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/huoshendawo_mo/article/details/49944621
个人分类: web开发
上一篇关于mySql中的自动增长值的设置
下一篇定时器的简单示例(setInterval clearInterval)
想对作者说点什么? 我来说一句

没有更多推荐了,返回首页

关闭
关闭