jQuery选中该复选框来实现/全部取消/未选定/获得的选定值
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript" src="../js/jquery-1.9.1.js"></script>
<script type="text/javascript">
$(document).ready(function() {
// 全选/取消所有
$("#checkAllChange").click(function() {
if (this.checked == true) {
$(".userid").each(function() {
this.checked = true;
});
} else {
$(".userid").each(function() {
this.checked = false;
});
}
});
// 全选
$("#checkAll").click(function() {
$(".userid").each(function() {
this.checked = true;
});
});
// 取消所有
$("#removeAll").click(function() {
$(".userid").each(function() {
this.checked = false;
});
});
// 反选
$("#reverse").click(function() {
$(".userid").each(function() {
if (this.checked == true) {
this.checked = false;
} else {
this.checked = true;
}
})
});
//批量删除
$("#delAll").click(function() {
var arrUserid = new Array();
$(".userid").each(function(i) {
if (this.checked == true) {
arrUserid[i] = $(this).val();
}
});
alert("批量删除的:" + arrUserid);
});
});
</script>
</head> <body>
<table border="1">
<tr>
<td><input type="checkbox" id="checkAllChange" /></td>
<td>用户id</td>
<td>username</td>
<td>电话</td>
<td>地址</td>
</tr>
<tr>
<td><input type="checkbox" class="userid" value="1" /></td>
<td>1</td>
<td>wangzs1</td>
<td>18888000</td>
<td>浦东</td>
</tr>
<tr>
<td><input type="checkbox" class="userid" value="2" /></td>
<td>2</td>
<td>wangzs2</td>
<td>18888001</td>
<td>上海</td>
</tr>
<tr>
<td><input type="checkbox" class="userid" value="3" /></td>
<td>3</td>
<td>wangzs3</td>
<td>18888002</td>
<td>河南</td>
</tr>
<tr>
<td><input type="checkbox" class="userid" value="4" /></td>
<td>4</td>
<td>wangzs4</td>
<td>18888003</td>
<td>许昌</td>
</tr>
<tr>
<td></td>
<td><input type="button" id="checkAll" value="全选" /></td>
<td><input type="button" id="removeAll" value="取消所有" /></td>
<td><input type="button" id="reverse" value="反选" /></td>
</tr>
<tr>
<td colspan="4" align="center"><input type="button" value="批量删除" id="delAll"></td>
</tr>
</table>
</body> </html>
版权声明:本文博客原创文章。博客,未经同意,不得转载。
jQuery选中该复选框来实现/全部取消/未选定/获得的选定值的更多相关文章
- 11月8日下午Jquery取属性值(复选框、下拉列表、单选按钮)、做全选按钮、JSON存储、去空格
1.jquery取复选框的值 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "htt ...
- Jquery取属性值(复选框、下拉列表、单选按钮)、做全选按钮、JSON存储、去空格
1.jquery取复选框的值 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "htt ...
- javascript 动态控制复选框的选择和取消
这里就需要引入一个jquery-1.4.2.js 就行了,因为用到了里面的选择器 <html> <head> <script type="text/javasc ...
- Jquery学习笔记:操作form表单元素之二(复选框和单选框)
在上面文章的基础上,我们介绍如何操作表单元素中的 复选框和单选框. 一.复选框 <label> <input type="checkbox" id="i ...
- jquery:获取checked复选框的问题
jquery:获取checked复选框的问题 功能描述:要完成一个全选的功能,但总是获取不到复选框的被选中的个数,究其原因,是Jquery中length和checked使用不当所造成的. // 获取所 ...
- 【jQuery】对于复选框操作的attr与prop
这个是在jQuery1.6版本号之后出现的鬼东西.受影响的主要有下拉列表select与复选框checkbox.众所周知.在jQuery中能够用attr()取出节点的属性,然而对于checkbox却不是 ...
- 表格中的checkbox复选框 全选非全选 公共方法 及提交选中结果
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title&g ...
- 使用JQuery做一组复选框的功能。
之前做过复选框的功能,奈何笔记丢失,害的我又鼓捣了一番...还是博客园做笔记比较好. 假设现在有一个表格,每一行都有一个复选框按钮.在表头还有一个全选的复选框按钮. ①.当点击一个全选按钮时,下面的同 ...
- 转载:Bootstrap之表格checkbox复选框全选
转:http://blog.csdn.net/shangmingchao[商明超的博客] 效果图: HTML中无需添加额外的一列来表示复选框,而是由JS完成,所以正常的表格布局就行了: 版权声明:如需 ...
随机推荐
- 第三篇——第二部分——第六文 监控SQL Server镜像
原文:第三篇--第二部分--第六文 监控SQL Server镜像 原文出处:http://blog.csdn.net/dba_huangzj/article/details/26846203 要优化, ...
- 监测谁用了SQL Server的Tempdb空间
原文:监测谁用了SQL Server的Tempdb空间 转自:http://blogs.msdn.com/b/apgcdsd/archive/2011/02/11/sql-server-tempdb. ...
- 移动端 rem字体的使用demo
<!doctype html> <html> <head> <meta charset="utf-8"> <title ...
- HDU 3313 Key Vertex(dfs + bfs)
HDU 3313 Key Vertex 题目链接 题意:一个有向无环图.求s,t之间的割点 思路:先spfa找一条最短路出来,假设不存在.就n个都是割点. 然后每次从s进行dfs,找到能经过最短路上的 ...
- python基础课程_学习笔记13:标准库:有些收藏夹——sys
标准库:有些收藏夹 sys sys这个模块可以让你访问和python解释器联系紧密的变量和函数. sys模块中一些重要的函数和变量 函数/变量 描写叙述 argv 命令行參数,包含脚本名称 exit( ...
- Java多线程总结之由synchronized说开去(转)
这几天不断添加新内容,给个大概的提纲吧,方面朋友们阅读,各部分是用分割线隔开了的: synchronized与wait()/notify() JMM与synchronized ThreadLocal与 ...
- IOS开发——Protocol使用协议
protocol ['prəutəkɔl] (样例:http://blog.sina.com.cn/s/blog_6aafe9c90100yozz.html ) 一.说明 两个类进行通讯,用协议就比 ...
- 探索Scala(1)-- 运算符重载
Scala语言运算符重载全然是语法层面的小把戏,本文记录我对Scala语言运算符重载的一些理解. 方法调用语法糖 调用方法时,Scala同意省略点号和圆括号,如以下代码所看到的: 把运算符映射成单词 ...
- 【SSH之旅】一步学习的步Struts1相框(三):分析控制Struts1示例
部分博客,,先后实施了Struts抽样.现在我们来分析这个样本.具体解释Struts1. Struts1的几个核心组件是值得我们注意的: (1)ActionServlet(核心控制器). (2)Act ...
- 于ubuntu-kylin14.10下一个,无法使用apt-get具( libc6-i386 : 赖: libc6 (= 2.15-0ubuntu10.5) 但 2.19-0ubuntu6 一个已)
这篇文章有xhz1234(徐洪志)书写.转载请注明出处. http://blog.csdn.net/xhz1234/article/details/37044531 作者:徐洪志 背景:安装wine. ...