首先定义一个可以进行全选和反选的checkbox:
<input type="checkbox" name="all" id="all" onclick="checkAll(this)" />
当然,下面会有很多的checkbox需要进行操作,采用下面的方式:
<input type="checkbox" name="indexed" id="indexed${taskId}" value="${taskId}" />
正如你若看到的,它们的name属性是一样的。
写几个js方法进行操作:
/***** 全选和反选 *****/ function checkAll(obj) { var boxs = document.getElementsByName('indexed'); if(obj.checked) { for(var i=0; i<boxs.length; i++) { boxs[i].checked=true; } }else { for(var i=0; i<boxs.length; i++) { boxs[i].checked=false; } } } /** 检查是否选择了记录 **/ function checkSelected(){ var obj = document.getElementsByName('indexed'); var checked = false; for(var i =0;i<obj.length;i++){ if(obj[i].checked){ checked=true; break; } } if (!checked){ return false; } return true; } /** 单条删除 **/ function delete_single(id){ //点击后面的删除链接,将前面的复选框勾选上 var ocheckbox = document.getElementsByName('indexed'); for(var i =0;i<ocheckbox.length;i++){ if(ocheckbox[i].value==id){ ocheckbox[i].checked = true; break; } } deleteTask(); } /***** 批量删除 *****/ function deleteTask(){ var element=document.getElementsByName("indexed"); var ids=""; for(var i=0;i<element.length;i++){ if(element[i].checked==true){ ids+="'"+ element[i].value +"',"; } } if(!checkSelected()) { alert('您未选择任何记录!'); } else { ids=ids.slice(0,ids.lastIndexOf(",")); } //ids的最终格式:'1','2','3' //这样在进行数据库的批量操作时,可以直接用in关键字 }
1 楼
zhenglongfei
2012-01-06
反选和全选只需要设置checked值为true false 就行了,这么多代码,新手容易看不懂
2 楼
jd406
2012-01-06
zhenglongfei 写道
反选和全选只需要设置checked值为true false 就行了,这么多代码,新手容易看不懂
反选和全选只需要上面前两个方法就行了,后面的是拓展的,因为用得比较多。
3 楼
idealwangqing
2012-01-06
/*全选*/
for(var i=0; i<boxs.length; i++) {
boxs[i].checked=obj.checked;
}
/*反选*/
for(var i=0; i<boxs.length; i++) {
boxs[i].checked=!(obj.checked);
}
for(var i=0; i<boxs.length; i++) {
boxs[i].checked=obj.checked;
}
/*反选*/
for(var i=0; i<boxs.length; i++) {
boxs[i].checked=!(obj.checked);
}
4 楼
idealwangqing
2012-01-07
idealwangqing 写道
/*全选*/
for(var i=0; i<boxs.length; i++) {
boxs[i].checked=obj.checked;
}
/*反选*/
for(var i=0; i<boxs.length; i++) {
boxs[i].checked=!(obj.checked);
}
for(var i=0; i<boxs.length; i++) {
boxs[i].checked=obj.checked;
}
/*反选*/
for(var i=0; i<boxs.length; i++) {
boxs[i].checked=!(obj.checked);
}
/*反选*/
for(var i=0; i<boxs.length; i++) {
boxs[i].checked=!(boxs[i].checked);
}
5 楼
jd406
2012-01-08
idealwangqing 写道
idealwangqing 写道
/*全选*/
for(var i=0; i<boxs.length; i++) {
boxs[i].checked=obj.checked;
}
/*反选*/
for(var i=0; i<boxs.length; i++) {
boxs[i].checked=!(obj.checked);
}
for(var i=0; i<boxs.length; i++) {
boxs[i].checked=obj.checked;
}
/*反选*/
for(var i=0; i<boxs.length; i++) {
boxs[i].checked=!(obj.checked);
}
/*反选*/
for(var i=0; i<boxs.length; i++) {
boxs[i].checked=!(boxs[i].checked);
}
嗯,这里我上面写错了,我写的是全选和取消全选,下面这个才是正确的。