全选按钮相关代码

1. 全选

$("#chckAll").click(function () {

//如果"全选"按钮是选中状态，则列表中所有checkbox都选中

/*if(this.checked==true){

$("#tBody input[type='checkbox']").prop("checked",true);

}else{

$("#tBody input[type='checkbox']").prop("checked",false);

}*/

$("#tBody input[type='checkbox']").prop("checked",this.checked);

});

2. 改变数据选者条件，改变全选按钮，要使用父选者器。on事件

1,在页面中给元素添加事件语法：

1)使用元素的事件属性：onxxxx="f()"

2)使用jquery对象：选择器.xxxx(function(){

//js代码

//this

});

*只能给固有元素添加事件

固有元素：当调用事件函数给元素添加事件时，如果元素已经生成，则这些元素叫做固有元素；

动态生成的元素：当调用事件函数给元素添加事件时，如果元素还没有生成，后来生成的元素叫做动态生成的元素。

3)使用jquery的on函数：父选择器.on("事件类型",子选择器,function(){

//js代码

//this

});

父元素:必须是固有元素,可以直接父元素,也可以是间接父元素.

原则固有父元素范围越小越好.

事件类型：跟事件属性和事件函数一一对应。

子选择器：目标元素,跟父选择器构成一个父子选择器

*不但能给固有元素添加事件，还能够给动态生成的元素添加事件。

//改变列表的选者按钮，全选按钮改变

$("#tBody").on("click","input[type='checkbox']",function () {

if($("#tBody input[type='checkbox']").size()==$("#tBody input[type='checkbox']:checked").size()){

$("#chckAll").prop("checked",true);

}else{//如果列表中的所有checkbox至少有一个没选中，则"全选"按钮也取消

$("#chckAll").prop("checked",false);

}

})