可以实现全选、反全选。以及对选中的多个列表项,进行相同的处理。例子中为删除选中的行。代码如下:
<%@ page language="java" contentType="text/html; charset=utf-8"
pageEncoding="utf-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>全选以及批量删除</title>
</head>
<body>
<script type="text/javascript">
<!-- 全选,反全选-->
function allSelected() {
var handleEl = document.getElementById("pcheckedall");
var checkBoxList = document.getElementsByName("pchecked");
for(i=0; i < checkBoxList.length; i++) {
checkBoxList[i].checked = handleEl.checked;
}
}
<!-- 批量删除 -->
function MultiDelete(){
var records = document.cqForm.elements['pchecked'];
var ids="";
for(i=0; i<records.length; i++) {
if(records[i].checked){
ids += records[i].value + ",";
}
}
if(ids !=null && ids != ""){
if(confirm("删除的数据将无法恢复,确认删除?")) {
alert("调用后台处理程序,删除成功!");
}
else
return false;
} else {
alert("请至少选择一行!");
return false;
}
}
</script>
<form action="a.do" name="cqForm">
<h1>常见问题列表
<input type="button" name="Submit" value="删除选中" onclick="MultiDelete()"/>
</h1>
<table align="left" bordercolor="red" width="500">
<tr>
<td width="10%" align="center" width="30%" bgcolor="yellow"><input type="checkbox" name="pcheckedall" id="pcheckedall" onclick="allSelected()">
</td>
<td align="center" width="30%" bgcolor="yellow">标题1</td>
<td align="center" width="30%" bgcolor="yellow">内容1</td>
</tr>
<tr>
<td width="10%" align="center"><input type="checkbox" name="pchecked" id="pchecked" value="id1"></td>
<td align="center" width="30%">我的标题1</td>
<td align="center" width="30%">我的内容1</td>
</tr>
<tr>
<td width="10%" align="center"><input type="checkbox" name="pchecked" id="pchecked" value="id2"></td>
<td align="center" width="30%">我的标题2</td>
<td align="center" width="30%">我的内容2</td>
</tr>
<tr>
<td width="10%" align="center"><input type="checkbox" name="pchecked" id="pchecked" value="id3"></td>
<td align="center" width="30%">我的标题3</td>
<td align="center" width="30%">我的内容3</td>
</tr>
<tr>
<td width="10%" align="center"><input type="checkbox" name="pchecked" id="pchecked" value="id4"></td>
<td align="center" width="30%">我的标题4</td>
<td align="center" width="30%">我的内容4</td>
</tr>
</table>
</form>
</body>
</html>
分享到:
相关推荐
ListView嵌套ListView,checkbox全选,多选,父item全选后,下面的子item全部选中
labview2018多列列表框,全选,多选中行,然后生成指定的行数据
带计算,全选,多选,全不选的购物车 带计算,全选,多选,全不选的购物车
SilverLight DataGrid主从表折叠显示、全选、多选、选项删除、排序
Checkbox多选全选
Android列表实现单选、多选、全选、取消、删除
VB实现Listview全癣取消全癣多选功能,弹出提示式多选功能,用ListView将读取到的本地磁盘列表显示在内,然后在每行数据的前边增加一个选择框,用户通过这个复选框可实现对Listview内容的单癣多选功能,我觉得这是个...
这是一款原生JS实现的,点击表格列表选中,可以单选、多选、全选和反选的表格列表选择代码。 js代码 [removed] var all = document.getElementById("j_cbAll"); var tbody = document.getElementById("j_...
Android实现全癣单选多选功能实例,这个功能对于手机管理来说,相当有用了,一般情况下长按屏幕就会出现全选框,可多选 也可单选,选择之后可进行下一步操作,本例子就是实现这种功能,算是一个简单实用的模块实例吧...
tkinter自定义多选下拉列表框(带滚动条,全选)
实现listview 单选 多选 反选 全选功能.zip
简单代码实现android的多选、全选、反选功能。介绍功能实现的全过程以及需要注意的地方。简单代码分享,希望能给大家带来一些帮助!
支持多选的QComBobox(含全选选择框),通过接口决定是否包含全选选择框
asp.net中实现多选按钮的全选javascript代码
NULL 博文链接:https://heisetoufa.iteye.com/blog/356077
NULL 博文链接:https://leonel.iteye.com/blog/454174
本文主要分享了js实现功能比较全面的全选和多选的示例代码,具有很好的参考价值。下面跟着小编一起来看下吧
jsp页面的全选 选不选 反选功能事例 直接给标签起一样的name 然后可以直接用
CheckBox实现多选列表,并实现全选、反选功能
c#winform下拉多选自定义控件(带全选),可以自己定义选择项的下拉框