实现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只支持多选行,并不能支持三级及以上的多选,所以写了这篇技术博文供以后学习使用. 效 ...
随机推荐
- jquery.post用法补充(type设置问题)
jquery.post用法 http://blog.csdn.net/itmyhome1990/article/details/12578275 当使用ajax获取data数据的时候,直接data.f ...
- eclipse plugin 导出插件包
当我们的插件在完成一个阶段性开发的时候,我们要发布一个1.0的版本.这个时候会碰到一个问题.如何把我们的插件打成包?有多种途径,下面具体讨论一下. 首先从插件完成到被他人(或者我们自己)使用有两个步骤 ...
- ubuntu 学习笔记2--安装tomcat
参考维基百科http://wiki.ubuntu.org.cn/Tomcat 安装Tomcat sudo apt-get install tomcat6 设置Tomcat运行的JAVA环境 如果已经设 ...
- resin-pro-4.0.34 服務器在windows环境下的配置
resin-pro-4.0.34 服務器在windows环境下的配置(轉載请注明作者:icelong) 到caucho網站上http://www.caucho.com/download/下載resin ...
- winform程序中为无边框窗体手动添加窗体拖动代码
Point oldMousePoint;//记录开始移动窗口前鼠标点下箭头的位置 Point oldFormPoint;//记录开始移动窗口前窗体位置 // ...
- OpenXml操作Word的一些操作总结.
OpenXml操作Word的一些操作总结. OpenXml相对于用MS提供的COM组件来生成WORD,有如下优势: 1.相对于MS 的COM组件,因为版本带来的不兼容问题,及各种会生成WORD半途会崩 ...
- hdu 1213 How Many Tables(并查集练习)
题目链接:hdu1213 赤裸裸的并查集.....水题一个.... #include<stdio.h> #include<string.h> #include<algor ...
- day7 面向对象编程
编程范式 编程是程序员用特定的语法+数据结构+算法组成的代码来告诉计算机如何执行任务的过程,一个程序是程序员为了得到一个任务结果而编写的一组指令的集合,正所谓条条大路通罗马,实现一个任务的方式有很多种 ...
- struts2对ognl表达式的使用(配图解加讲解)
ognl它是一个功能强大的表达式语言,用来获取和设置Java对象的属性,它旨在提供一个更高的更抽象的层次来对Java对象图进行导航. 先看一张示意图 如果是下面的除了第一种valueStack的下面几 ...
- C++ 中内存分配和回收
void Allocate(char* &p,int size) { p = (char*)malloc(size); } void Test(void) { char *str = NULL ...