实现table中checkbox复选框、以及判断checked是否被选中、js操作checkedbox选中

上图是实现效果。
下面贴代码
表的第一行也就是<th>中的代码,onclick事件是实现全选或者全不选效果。
<th>
<input id="allboxs" onclick="allcheck()" type="checkbox"/>
</th>
td中的代码
<td>
<input name="boxs" type="checkbox"/>
</td>
js中实现全选、全不选效果
function allcheck() {
var nn = $("#allboxs").is(":checked"); //判断th中的checkbox是否被选中,如果被选中则nn为true,反之为false
if(nn == true) {
var namebox = $("input[name^='boxs']"); //获取name值为boxs的所有input
for(i = 0; i < namebox.length; i++) {
namebox[i].checked=true; //js操作选中checkbox
}
}
if(nn == false) {
var namebox = $("input[name^='boxs']");
for(i = 0; i < namebox.length; i++) {
namebox[i].checked=false;
}
}
}
以上代码值得一提的是,获取checkbox的值或其他的什么,建议用name属性值操作,因为id属性在每一个页面中默认是唯一的,而name属性则可以取到属性值相同的所有。
实现table中checkbox复选框、以及判断checked是否被选中、js操作checkedbox选中的更多相关文章
- ZH奶酪:纯CSS自定义Html中Checkbox复选框样式
原文链接:http://www.lrxin.com/archives-683.html 首先看下效果: 点击演示地址查看实例. 首先,需要添加一段CSS隐藏所有的Checkbox复选框,之后我们会改变 ...
- asp.net,根据gridview 中checkbox复选框选中的行对数据库进行操作
在asp.net中,使用checkbox,对gridview添加复选框. 多选数据行后,根据已选数据,对原数据进行多条语句查询. string sql = "Select * from 表 ...
- table中列复选框全选,再选 效果
<table class="table table-striped sortable table-bordered table-hover " id="zdnews ...
- jQuery+SpringMVC中的复选框选择与传值
一.checkbox选择 在jQuery中,选中checkbox通用的两种方式: $("#cb1").attr("checked","checked& ...
- QTableView中嵌入复选框CheckBox 的四种方法总结
搜索了一下,QTableView中嵌入复选框CheckBox方法有四种: 第一种不能之前显示,必须双击/选中后才能显示,不适用. 第二种比较简单,通常用这种方法. 第三种只适合静态显示静态数据用 第四 ...
- python QQTableView中嵌入复选框CheckBox四种方法
搜索了一下,QTableView中嵌入复选框CheckBox方法有四种: 第一种不能之前显示,必须双击/选中后才能显示,不适用. 第二种比较简单,通常用这种方法. 第三种只适合静态显示静态数据用 第四 ...
- Web版需求征集系统所得1,servlet中获取checkbox复选框的值
servlet中获取checkbox复选框的值 </tr> <tr> <td align="right">研究类型</td> < ...
- 关于Unity中NGUI的Checkbox复选框、Slider滑动条和Button的6种触发回调事件的方式
Checkbox复选框 1.创建一个NGUI背景Sprite1节点 2.打开NGUI---->Open---->Prefab Toolbar---->选择一个复选框节点,拖拽到背景节 ...
- vue基于element-ui的三级CheckBox复选框
最近vue项目需要用到三级CheckBox复选框,需要实现全选反选不确定三种状态.但是element-ui table只支持多选行,并不能支持三级及以上的多选,所以写了这篇技术博文供以后学习使用. 效 ...
随机推荐
- 一个吊丝android个人开发者的逆袭之路
转眼间,一年多过去了,记得我开发第一款android应用的时候,那是在前年的冬天,我本人是做java的,android的学习和开发完全是业余爱好,从前年上半年到前年下半年大约花了半年的业余时间把and ...
- 免费的Visual Studio的插件
在做了深入(的)研究之后(通过在google网站搜索),,我编译了15个免费Visual Studio 2005插件表..其中一些插件将提高您(的)代码(的)质量,,另外一些能使您编译(的)更快,,但 ...
- 在使用simplexml_load_file()函数读取xml文件时遇到<![CDATA[]]>,怎么让其进行解析
simplexml_load_file ( '1394.xml', 'SimpleXMLElement', LIBXML_NOCDATA ); 使用这个函数里面的这两个参数
- Using CrunchBase API
Let us have fun with CrunchBase API. What can CrunchBase API give us? They said: https://developer.c ...
- 一个方便且通用的导出数据到 Excel 的类库
一个方便且通用的导出数据到 Excel 的类库 起源: 之前在做一个项目时,客户提出了许多的导出数据的需求: 导出用户信息 导出业务实体信息 各种查询都要能导出 导出的数据要和界面上看到的一致 可以分 ...
- javascript ajax 脚本跨域调用全解析
javascript ajax 脚本跨域调用全解析 今天终于有点时间研究了一下javsscript ajax 脚本跨域调用的问题,先在网上随便搜了一下找到一些解决的办法,但是都比较复杂.由是转到jqu ...
- [Android开发常见问题-12] Android开发中debug.keystore如何使用。
有些团度在开发较大的项目的时候会用到debug.keystore这种debug签名,那么这个东西怎么用呢?之前在导出签名包的时候只需要android tools -> export signed ...
- Solr之NamedList 简单介绍与实例解析
大家都知道,Solr是一个基于Lucene高可配置的搜索服务器,大部分参数值以及相关优化等等都可以在solrconfig.xml中配置,那么就需要一个能够很快的进行解析和读取配置文件内容的数据结构,为 ...
- hadoop部署错误
hadoop的单机部署很简单也不容易出错,但是对生产环境的价值和意义不大,但是可以快速用于开发. 部署hadoop的错误原因不少,并且很奇怪. 比如,用户名不同,造成客户端和服务器通讯产生认证失败的错 ...
- Cocos2d-x 3.x事件分发机制总结
在2.x中处理事件需要用到委托代理(delegate),相信学过2.x的触摸事件的同学,都知道创建和移除的流程十分繁琐.而在3.x中由于加入了C++11的特性,而对事件的分发机制通过事件分发器Even ...