from:http://blog.donews.com/dragonflyer/archive/2005/09/09/546609.aspx
使用复选框选可以很方便的一次选择多个数据,对于用户来说是很方便的。下面给出一种实现方法,共同学习。如果有其他更好的方法,也希望各位能共享出来。
页面中的处理:
<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>
后台的取值方法:
String no[] = request.getParameterValues("no");
分享到:
相关推荐
有源码有实例,delphi Listview复选框checkbox实现单选的功能,代码很精简实用,测试完美!
CSS3美化复选框checkbox CSS3美化复选框checkbox CSS3美化复选框checkbox CSS3美化复选框checkbox CSS3美化复选框checkbox
QTreeView Checkboxes 需要实现一个功能:在QT的TreeView中,能够使用复选框,并且选中父节点的复选框可以全选或取消子节点的复选框。 参考链接: http://blog.csdn.net/ajaxhe/article/details/7518285
用javascript+css实现的树形复选框(Checkbox),可显示选中数和有展缩功能.
这是一款效果非常酷的CSS3复选框checkbox样式美化效果。该复选框美化效果共有11种。默认的复选框的样式十分不好看,该效果将复选框加一美化,带上了一些动画效果,其中一些制作为滑动按钮的样式。
一款好看的jQuery自定义美化复选框checkbox样式代码,可以定义复选框的颜色和形状,让复选框风格不再像默认样式那样单调。
CSS3自定义美化复选框Checkbox按钮样式代码 CSS3自定义美化复选框Checkbox按钮样式代码 CSS3自定义美化复选框Checkbox按钮样式代码
带复选框(checkbox)的树带复选框(checkbox)的树带复选框(checkbox)的树带复选框(checkbox)的树
复选框里的值通过表单post方法传入数据库
这是一款表单复选框checkbox美化特效,多选框按钮美化代码。
复选框checkbox的jquery插件, 用法:if($("#check").check()) $("#check").check(true);
jQuery多级复选框checkbox选中代码,支持水平横向与垂直纵向排列,共有3种排列样式,具体看演示。
NULL 博文链接:https://lhbthanks.iteye.com/blog/2101997
加载复选框CheckBox
对于jQuery自定义复选框checkbox和单选框Radiobox,我们已经有介绍过不少了,比如9款迷人样式的CSS3自定义Checkbox复选框和HTML5/CSS3开关按钮 立体3D按钮。今天要介绍的是一款基于jQuery的美化版复选框,它的特点是...
JS复选框checkbox动画特效下载是一款可以使原生的checkbox复选框被点击的时候,产生一些有趣的动画效果。
一行代码搞定layui数据表格的表头checkbox复选框隐藏问题。
这是一款效果非常炫酷的CSS3复选框checkbox动画特效。这组复选框动画特效共3种效果,它们都是在原生checkbox元素的基础上进行了美化,在用户点击复选框的时候制作出非常酷的动画效果。
插件描述:9款表单复选框(Checkbox)与单选按钮美化. 参考示例:http://www.jq22.com/jquery-info5907
jQuery实现复选框checkbox的全选与反选功能,不用多介绍了吧,以往都是基于纯js的实现比较多,这个是引入了jquery,或许更能满足现在的前端设计吧。