<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复选框全选以及获取值的更多相关文章

  1. checkbox复选框全选批量删除

    多选框全选实现批量删除 html代码 <body> <form action="" method="post" name="Form ...

  2. jQuery 实现复选框全选、反选及获取选中的值

    实现复选框全选,反选及获取选中的值: 代码如下: <!doctype html> <html lang="en"> <head> <met ...

  3. jQuery 前端复选框 全选 反选 下拉菜单联动

    jQuery 页面中复选框全选.反选.下拉联动(级联) <!DOCTYPE html> <html lang="en"> <head> < ...

  4. js 复选框 全选都选 如果某一个子复选框没选中 则全选按钮不选中

    <!DOCTYPE HTML> <html> <head> <meta charset=UTF-8> <title>js 复选框 全选都选 ...

  5. JavaScript小例子：复选框全选

    JavaScript小例子:复选框全选 这只是一个小例子,很简单,但是这个功能还是很常用的: 实现后效果如图: JavaScript代码: <script type="text/jav ...

  6. Jquery表格变色 复选框全选，反选

    /*jquery静态表格变色*/ $(".tr2").mouseover(function(){ $(this).css("background"," ...

  7. 复选框全选、全不选和反选的效果实现VIEW:1592

    <html> <head> <meta http-equiv="Content-Type" content="text/html; char ...

  8. html+css+js实现复选框全选与反选

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/ ...

  9. jQuery 复选框全选/取消全选/反选

    jQuery实现的复选框全选/取消全选/反选及获得选择的值. 完整代码: <!DOCTYPE html> <html> <head> <script type ...

  10. js 判断 复选框全选、全不选、反选、必选一个

    一个挺 使用的 js 代码片段,  判断  复选框全选.全不选.反选.必选一个 记录下, 搬来的 思路: 修改数据的 选中与否状态, 拿到所有的输入框,看是否有选中的状态 <html> & ...

随机推荐

  1. Markdown语法说明（详解版）

    ####date: 2016-05-26 20:38:58 tags: Markdown tags && Syntax ##Markdown语法说明(详解版)杨帆发表于 2011-11 ...

  2. jffs2和yaffs2文件系统制作工具的编译与使用

    一 . 先准备文件 mtd-utils-1.4.5.tar.bz2 ftp://ftp.infradead.org/pub/mtd-utils/ zlib-1.2.5.tar.bz2 http://z ...

  3. MIL 多示例学习 特征选择

    一个主要的跟踪系统包含三个成分:1)外观模型,通过其可以估计目标的似然函数.2)运动模型,预测位置.3)搜索策略,寻找当前帧最有可能为目标的位置.MIL主要的贡献在第一条上. MIL与CT的不同在于后 ...

  4. response.write();改变页面布局的原因及解法

    Response.Write ,在ASP.NET 中不要随便使用 Response.Write,其原因是它会打乱 ASP.NET 的输出流顺序,在aspx.cs 中使用 Response.Write ...

  5. MySQL乱码问题

      JSP的request 默认为ISO8859_1,所以在处理中文的时候, 要显示中文的话,必须转成GBK的,如下 String str=new String(request.getParamete ...

  6. 简单使用Apache POI

    Apache POI是一个纯Java编写用来操作Microsoft Office的框架,最常见的应用是让服务器后台按照特定的数据生成Excel表格提供给用户实用.前段时间因为项目的需要被大量使用,使用 ...

  7. CSS3 笔记三（Shadow/Text/Web Fonts）

    CSS3 Shadow Effects text-shadow box-shadow 1> text-shadow The text-shadow property adds shadow to ...

  8. 数据分析 - 斯特鲁普效应(Stroop effect)

    数据分析 - 斯特鲁普效应(Stroop effect) Reinhard得到了一份斯特鲁普效应试验的数据,我们来分析下,文字的颜色,是否会影响受试者的反应. 这里先看看什么是斯特鲁普效应: 斯特鲁普 ...

  9. HTML5的Video标签的属性,方法和事件汇总

    <video>标签的属性 src :视频的属性 poster:视频封面,没有播放时显示的图片 preload:预加载 autoplay:自动播放 loop:循环播放 controls:浏览 ...

  10. 扩展GridView实现的一个自定义无刷新分页，排序，支持多种数据源的控件TwfGridView

    最近项目View层越来越趋向于无刷新化,特别是数据展示方面,还要对Linq有很好的支持.在WebFrom模式的开发中,GridView是一个功能很强大,很常用的控件,但是他也不是完美的,没有自带的无刷 ...