<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>复选框的全选</title>
</head>
<body>
<script language="JavaScript" type="text/JavaScript">
/* 是否全选标记 */
var checkedAll = false;
/* 全选/取消全选
* formName 所在form的name值
* checkboxName checkbox的name值
* 注意:所有checkbox的name值都必须一样,这样才能达到全选的效果
*/
function selectAll(formName,checkboxName){
var form = document.all.item(formName);
var elements = form.elements[checkboxName];
for (var i=0;i<elements.length;i++){
var e = elements[i];
if(checkedAll){
e.checked = false;
form.alls.checked = false;
} else {
e.checked = true;
form.alls.checked = true;
}
}
if(checkedAll){
checkedAll = false;
} else {
checkedAll = true;
}
}
/* 检查是否有checkbox被选中
* formName 所在form的name值
* checkboxName checkbox的name值
* 注意:所有checkbox的name值都必须一样,这样才能达到全选的效果
*/
function checkAll(formName,checkboxName){
var hasCheck = false;
var form = document.all.item(formName);
var elements = form.elements[checkboxName];
for (var i=0;i<elements.length;i++){
var e = elements[i];
if(e.checked){
hasCheck = true;
}
}
return hasCheck;
}
/* 执行操作 */
function do_action(){
if (!checkAll("formName","no")){
alert("没有checkbox被选中,提示用户至少选择一个!");
} else {
alert("已有checkbox被选中,可以继续后续操作!");
}
}
</script>
<form name="formName" method="get">
<table id="dataList" width="200" align="center" border="1">
<tr>
<td><input type="checkbox" name="alls" onClick="selectAll('formName','no')" title="全选/取消全选">
</td>
<td align="center"> 学号 </td>
<td align="center"> 姓名 </td>
</tr>
<tr>
<td><input type="checkbox" name="no" value="001" title="选择/不选择">
</td>
<td> 001 </td>
<td> 张三 </td>
</tr>
<tr>
<td><input type="checkbox" name="no" value="002" title="选择/不选择">
</td>
<td> 002 </td>
<td> 李四 </td>
</tr>
</table>
<p align="center"><input type="button" name="actionButton" value="操作" onClick="do_action()"></p>
</form>
</body>
</html>
后台Servlet获取值的代码:
//这是在java代码中获取checkbox的值
String type = "";
String[] type1 = request.getParameterValues("checkbox1");
for (int i = 0; i < type1.length; i++) {
type += type1[i] + ",";
}
System.out.println(type);
CheckBox复选框全选以及获取值的更多相关文章
-
checkbox复选框全选批量删除
多选框全选实现批量删除 html代码 <body> <form action="" method="post" name="Form ...
-
jQuery 实现复选框全选、反选及获取选中的值
实现复选框全选,反选及获取选中的值: 代码如下: <!doctype html> <html lang="en"> <head> <met ...
-
jQuery 前端复选框 全选 反选 下拉菜单联动
jQuery 页面中复选框全选.反选.下拉联动(级联) <!DOCTYPE html> <html lang="en"> <head> < ...
-
js 复选框 全选都选 如果某一个子复选框没选中 则全选按钮不选中
<!DOCTYPE HTML> <html> <head> <meta charset=UTF-8> <title>js 复选框 全选都选 ...
-
JavaScript小例子:复选框全选
JavaScript小例子:复选框全选 这只是一个小例子,很简单,但是这个功能还是很常用的: 实现后效果如图: JavaScript代码: <script type="text/jav ...
-
Jquery表格变色 复选框全选,反选
/*jquery静态表格变色*/ $(".tr2").mouseover(function(){ $(this).css("background"," ...
-
复选框全选、全不选和反选的效果实现VIEW:1592
<html> <head> <meta http-equiv="Content-Type" content="text/html; char ...
-
html+css+js实现复选框全选与反选
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/ ...
-
jQuery 复选框全选/取消全选/反选
jQuery实现的复选框全选/取消全选/反选及获得选择的值. 完整代码: <!DOCTYPE html> <html> <head> <script type ...
-
js 判断 复选框全选、全不选、反选、必选一个
一个挺 使用的 js 代码片段, 判断 复选框全选.全不选.反选.必选一个 记录下, 搬来的 思路: 修改数据的 选中与否状态, 拿到所有的输入框,看是否有选中的状态 <html> & ...
随机推荐
-
JS获得鼠标位置
<body> <script> function mouseMove(ev) { ev = ev || window.event; var mousePos = mouseCo ...
-
Xamarin Android设置界面提示类型错误
Xamarin Android设置界面提示类型错误 错误信息:Integer types not allow (at ‘padding’ with value ’10’)Android界面属性的长度和 ...
-
ThinkPHP 学习笔记 ( 五 ) 数据验证
根据官网的教程 ( http://www.thinkphp.cn/info/171.html ),数据验证的使用静态定义方式 ( 以 regex 为例 ) 无法验证数据: 而采用动态验证则正常: 控制 ...
-
hdu 1466 计算直线的交点数
http://acm.hdu.edu.cn/showproblem.php?pid=1466 N条直线的交点方案数 = c 条直线交叉的交点数与(N-c)条平行线 + c 条直线本身的交点方案 = ( ...
-
用 Python分析朋友圈好友的签名
需要用到的第三方库: numpy:本例结合wordcloud使用 jieba:对中文惊进行分词 PIL: 对图像进行处理(本例与wordcloud结合使用) snowlp:对文本信息进行情感判断 wo ...
-
设置SVN不需要提交的文件
设置SVN不需要提交的文件 .project .classpath .settings .externalToolBuilders 也可以在TortoiseSVN中设置
-
第26月第25天 ubuntu openjdk-8-jdk jretty
1.ubuntu ============== sudo apt-get install openjdk-8-jdk https://blog.csdn.net/zhaohaiyitian88/art ...
-
redis数据库通过dump.rdb文件恢复数据库或者数据库迁移
环境:centos7.2软件:redis-3.2.10(yum安装) 情景一:公司之前的redis没有开启aof模式,一直是rdb模式,但是数据又非常重要,数据一点也不能丢失,所以需要开启aof,但是 ...
-
3.7Python数据处理篇之Numpy系列(七)---Numpy的统计函数
目录 目录 前言 (一)函数一览表 (二)统计函数1 (三)统计函数2 目录 前言 具体我们来学Numpy的统计函数 (一)函数一览表 调用方式:np.* .sum(a) 对数组a求和 .mean(a ...
-
2018/09/05《涂抹MySQL》【权限管理】学习笔记(二)
读 第四章<管理MySQL库与表> 第五章<MySQL的权限管理> 总结 1:当配置好 MySQL 数据库后,发现有几个默认的库,他们的意义和作用?(这里只做简单了解,之后用到 ...