<!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选中该复选框来实现/全部取消/未选定/获得的选定值的更多相关文章

  1. 11月8日下午Jquery取属性值(复选框、下拉列表、单选按钮)、做全选按钮、JSON存储、去空格

    1.jquery取复选框的值 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "htt ...

  2. Jquery取属性值(复选框、下拉列表、单选按钮)、做全选按钮、JSON存储、去空格

    1.jquery取复选框的值 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "htt ...

  3. javascript 动态控制复选框的选择和取消

    这里就需要引入一个jquery-1.4.2.js 就行了,因为用到了里面的选择器 <html> <head> <script type="text/javasc ...

  4. Jquery学习笔记:操作form表单元素之二(复选框和单选框)

    在上面文章的基础上,我们介绍如何操作表单元素中的 复选框和单选框. 一.复选框 <label> <input type="checkbox" id="i ...

  5. jquery:获取checked复选框的问题

    jquery:获取checked复选框的问题 功能描述:要完成一个全选的功能,但总是获取不到复选框的被选中的个数,究其原因,是Jquery中length和checked使用不当所造成的. // 获取所 ...

  6. 【jQuery】对于复选框操作的attr与prop

    这个是在jQuery1.6版本号之后出现的鬼东西.受影响的主要有下拉列表select与复选框checkbox.众所周知.在jQuery中能够用attr()取出节点的属性,然而对于checkbox却不是 ...

  7. 表格中的checkbox复选框 全选非全选 公共方法 及提交选中结果

    <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title&g ...

  8. 使用JQuery做一组复选框的功能。

    之前做过复选框的功能,奈何笔记丢失,害的我又鼓捣了一番...还是博客园做笔记比较好. 假设现在有一个表格,每一行都有一个复选框按钮.在表头还有一个全选的复选框按钮. ①.当点击一个全选按钮时,下面的同 ...

  9. 转载:Bootstrap之表格checkbox复选框全选

    转:http://blog.csdn.net/shangmingchao[商明超的博客] 效果图: HTML中无需添加额外的一列来表示复选框,而是由JS完成,所以正常的表格布局就行了: 版权声明:如需 ...

随机推荐

  1. iOS多用连接、反向协议、安全

    资源 WWDC-2013-Session-708 BlackHat-US-2014-"It Just (Net)works" Understanding Multipeer Con ...

  2. War文件部署(转)

    其实,开始要求将源码压缩成War文件时,一头雾水! 公司项目要求做CAS SSO单点登录 也就是这玩意.... 其实war文件就是Java中web应用程序的打包.借用一个老兄的话,“当你一个web应用 ...

  3. C语言,如何检查文件是否存在和权限的信息

    按功能access,头文件io.h(linux通过使用unistd.h    int   access(const   char   *filename,   int   amode); amode參 ...

  4. 使用block实现两个页面之间的传统价值观

    第二个view声明一个block属性: @property (nonatomic, copy) void(^doTransferMsg)(NSString *_msg); 然后传值方法里检查block ...

  5. Vijos.1096 津津储蓄计划

    见问题: https://vijos.org/p/1096 主题概述 津津的零花钱一直都是自己的管理.每月初的母亲津津300美元,津津将于本月支出预算.而且总是做同样的实际支出与预算.  为了让津津学 ...

  6. ruby 删除文件夹(包括文件夹中的文件夹和文件)

    def deleteDirectory(dirPath) if File.directory?(dirPath) puts "是文件夹"; Dir.foreach(dirPath) ...

  7. ASP.NET MVC4实现URL伪静态

    1.在Web.config添加节点配置: <system.webServer> <modules runAllManagedModulesForAllRequests="t ...

  8. linux虚拟机网络配制方法及遇到问题的解决方法

    linux虚拟机网络问题 刚安装一个vmware虚拟机.并在上面安装了一个redhat linux操作系统. 安装完后配制了下网络. 首先观察windows上的网络配制. ip:192.168.1.1 ...

  9. POJ 2431 Expedition (贪心+优先队列)

    题目地址:POJ 2431 将路过的加油站的加油量放到一个优先队列里,每次当油量不够时,就一直加队列里油量最大的直到能够到达下一站为止. 代码例如以下: #include <iostream&g ...

  10. 中介模式和学习日记Effective C++

    中介模式(Mediator):利用中介对象来封装一组对象交互.中保使对象并不需要显式地相互引用,使得松耦合,的交互. (1).中介者模式非常easy在系统中应用,也非常easy在系统中误用.当系统出现 ...