批量选中、取消多个checkbox的用法很简单,这个功能也很常用。这里做个总结。

在HTML中的写法:

 <div id="ftpFileDownTr">
<button onclick="getBatchValues();" value="获取批量选择的值"/>
</div>
<table>
<tr id="ftpFileTitle">
<th>
<input type="checkbox" onclick="checkAll(this.checked)"/>全部选中/全部取消
</th>
<th>文件名称</th>
<th>文件大小</th>
<th>文件进度</th>
<th>文件状态</th>
<th>操作</th>
</tr>
<tr>
<td>
<input type="checkbox" name="checkOne" value="a"/>
</td>
<td>文件名a</td>
<td>100M</td>
<td>10%</td>
<td>状态1</td>
<td>操作1</td>
</tr>
<tr>
<td>
<input type="checkbox" name="checkOne" value="b"/>
</td>
<td>文件名b</td>
<td>100M</td>
<td>10%</td>
<td>状态2</td>
<td>操作2</td>
</tr>
<tr>
<td>
<input type="checkbox" name="checkOne" value="a"/>
</td>
<td>文件名c</td>
<td>100M</td>
<td>10%</td>
<td>状态3</td>
<td>操作3</td>
</tr>
</table>

checkbox批量选择、批量取消效果的js写法:

 function checkAll(checked){//批量选择、批量取消
$('input[name="checkOne"]').attr("checked",checked);
}

获取批量选中的checkbox的值的方法:

 function getBatchValues(ctx){
var checkedArr=$("input[name='checkOne']:checked");
if (checkedArr.length == 0){
alert("至少要选择一条数据");
return false;
}
var valueStr="";//值以","为分隔符
for(var i=0;i<checkedArr.length;i++){
if(i==0){
valueStr+=$(checkedArr[i]).val();
}else{
valueStr+=","+$(checkedArr[i]).val();
}
}
alert(valueStr);
}

就这样。

在后台java程序中:

 private String checkOne;//后台获取到的属性值,是所有name=checkOne的表单值的总和,以","分隔
public void setCheckOne(String checkOne){
this.checkOne=checkOne;
}
public String getCheckOne(){
return checkOne;
}

checkbox做全部选中,全部取消效果的更多相关文章

  1. jQuery操作复选框checkbox技巧总结 ---- 设置选中、取消选中、获取被选中的值、判断是否选中等

    转载:https://blog.csdn.net/chenchunlin526/article/details/77448168 jQuery操作复选框checkbox技巧总结 --- 设置选中.取消 ...

  2. 黄聪:JQUERY判断操作CHECKBOX选中、取消选中、反选、第二次无法选中的问题

    用JQuery做CheckBox全选和反选的时候,遇到一个问题.当用JQ控制全选,全取消一次以后,再次点击全选,发现代码变了,但是CheckBox没有处于选中状态. $("#id" ...

  3. jQuery操作CheckBox的方法(选中,取消,取值)

    jQuery操作CheckBox的方法(选中,取消,取值). 代码: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional/ ...

  4. JS实现全选与取消 Jquery判断checkbox是否被选中

    1.JS实现checkbox全选与取消 <body> <input type="checkbox" name="select_all"/> ...

  5. Extjs4.x完美treepanel checkbox无限级选中与取消

    注:当node选中, childNodes逐级全部选中. parentNode当子node全部选中时逐级自动选中,nodes未全部选中, parentNode逐级自动取消选中 在javascript中 ...

  6. Tree树节点选中及取消和指定节点的隐藏

    指定节点变色 指定节点隐藏 单击节点 未选中则选中该节点 已选中则取消该节点 前台: 1.HTML <ul id="listDept" name="listDept ...

  7. JQuery的复选框选中、取消、全选,全不选问题

    一.必须引入JQuery库: 下面是js代码: /*** * 服务管理块>>>复选框事件处理 */ //服务管理复选框被选中.取消$(function(){ $("#Ser ...

  8. jquery实现checkbox全选和全部取消,以及获取值

    在后台管理中经常会遇到列表全选和取消的功能,如评论审核.申请等,用到的html标记就是checkbox.我用的是mysql数据库,代码如下: <!DOCTYPE html PUBLIC &quo ...

  9. 测试Javacript里的checkbox是否被选中的status和checked的替换方法

    测试Javacript里的checkbox是否被选中的status和checked的替换方法,checkbox.checked和checkbox.status的功能一样,注意checkbox.stat ...

随机推荐

  1. pycharm如何解决新建的文件没有后缀的问题

    如下设置: 1.settings 2.file and code templates3.点击图中绿色的“+”号,即可打开新建模板页面4.定义模板名字.后缀名保存即可

  2. JAVA 自定义注解在自动化测试中的使用

    在UI自动化测试中,相信很多人都喜欢用所谓的PO模式,其中的P,也就是page的意思,于是乎,在脚本里,或者在其它的page里,会要new很多的page对象,这样很麻烦,前面我们也讲到了注解的使用,很 ...

  3. 鱼缸的启示:Scale-out和Scale-up架构

    提到Scale-out和Scale-up,初看到可能会有点晕.其实我认为Scale-out和Scale-up的概念可以用一个简单的例子来解释. 不知您有没有养过鱼?当你只有六七条鱼的时候,一个小型鱼缸 ...

  4. 高性能Javascript(2) DOM编程

    第三部分 DOM编程 文档对象模型(DOM)是一个独立于语言的,使用XML和HTML文档操作的应用程序接口(API).在浏览器中,主要与HTML文档打交道,在网页应用中检索XML文档也很常见.DOM ...

  5. Mongodb嵌套文档的改动-利用数组改动器更新数据

    初学mongodb的可能和我一样有个疑问.mongodb是文档型的,那么假设一个文档嵌套另外一个文档,假设对这个嵌套文档进行增删改查呢. 就像例如以下这样:.怎样对auther里面的name进行增删改 ...

  6. 每日英语:Mrs. Obama Takes Stab at Ping-Pong Diplomacy

    U.S. first lady Michelle Obama took ping-pong diplomacy to a new level on Friday on her weeklong tou ...

  7. 国内AR行业现状研究之百度的AR

    AR(Augmented Reality),中文翻译增强现实.按我原来的知识体系,VR/AR的技术构成是相同的,只是追求的方向不同.VR是虚拟笼罩现实.让虚拟就是现实:AR则让虚拟进入现实.二者最终看 ...

  8. Brainfuck反汇编(Python)

    global cs global ip global ss #global sp global ds global bp global tab global out #cs='++++++++++[& ...

  9. js调用winform程序(带参数)

    我们会发现,我们点击迅雷下载的时候  网页可以调用应用程序,而且连接会传入迅雷,这个是怎么做到的呢? 原理: 先注册表中添加软件的具体信息,然后通过 href 可以直接调用 1.写入注册表信息,注册, ...

  10. Qt动态库静态库的创建、使用、多级库依赖、动态库改成静态库等详细说明

    本文描述的是windows系统下,通过qtcreator在pro文件中添加动态库与静态库的方法: 1.添加动态库(直接添加动态库文件.dll,非子项目) 通过qtcreator创建动态库的方法就不在此 ...