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;

});

} // www.jbxue.com

});

// 全选

$("#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>用户名</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. CheckedListBoxControl 实现复选框的单选与多选功能

    由于工作需要,需要实现复选框的单选与多选功能,找了好多资料都不是很全,经过两天苦苦的挖挖挖,终于完成啦O(∩_∩)O哈哈~ 用DEV控件中的CheckedListBoxControl控件,当然VS中的 ...

  2. JQuery的复选框选中、取消、全选，全不选问题

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

  3. jQuery实现checkbox（复选框）选中、全选反选代码

    谁都知道 在html 如果一个复选框被选中 是 checked="checked". 但是我们如果用jquery alert($("#id").attr(&qu ...

  4. jQuery对复选框（checkbox)的全选，全不选，反选等的操作

    效果截图: HTML代码: <body><ul id="list"> <li><label><input type=" ...

  5. 复选框（checkox）全选、全不选、反选、获得选中项值的用例

    HTML部分: <div class="all"> <ul> <li><input type="checkbox" v ...

  6. jquery 循环获取checkBox的值,以及对复选框选中，取消，操作按钮

    法一:jquery 循环获取选中checkBox框的值 function checkeds() { $("input:checkbox").each(function(index) ...

  7. 复选框回显、全选、非全选、cookie处理数据、json数组对象转换处理学习笔记参考的页面

    <%@include file="/common/head.jsp"%> <%@ page contentType="text/html; charse ...

  8. JavaScript实现单击全选 ,再次点击取消全选

                 以下为实现思路,已测试,供参考 var allSet = document.getElementById('allSet');//获取全选按钮元素 var a = allSe ...

  9. firefox(火狐)下 js中设置checkbox属性checked="checked"已有，但复选框却不显示勾选的原因

    刚看到问题时以为是浏览器兼容性的原因,ie.google都能正常显示. 网上查询之后发现是jQuery的attr()方法用的不恰当. jQuery1.6之前使用attr()可以修改 ,从jQuery ...

  10. jquery 实现 单选框点击取消

    <label for="1" class="z-label"> <input type="radio" class=&qu ...

随机推荐

  1. （剑指Offer）面试题61：按之字形顺序打印二叉树

    题目: 请实现一个函数按照之字形打印二叉树,即第一行按照从左到右的顺序打印,第二层按照从右至左的顺序打印,第三行按照从左到右的顺序打印,其他行以此类推. 思路: 按照广度优先遍历来遍历二叉树,但是需要 ...

  2. 帝吧fb出征是什么原因？帝吧fb出征事情始末 帝吧出征FB打“台独” 台湾网民崩溃：巨人之墙爆了

    帝吧出征FB打"台独" 台湾网民崩溃:巨人之墙爆了 发表时间:2016-01-20 21:08:10 字号:A-AA+ 关键字: 帝吧帝吧出征FB帝吧出征FB打台独台独脸书巨人之墙 ...

  3. webpack 安装以及使用

    1.安装webpack 全局安装代码: npm install -g webpack 2.项目中使用webpack (1)进入项目目录 cd C:\Users\dell\Documents\HBuil ...

  4. Eventually Consistent(最终一致性)（转）

    应该说搞分布式系统必读的文章了,转过来,这是2008年12月Werner revise过的版本,先贴上内容简介:分布式系统的CAP理论 CAP理论(data consistency, system a ...

  5. Windows下安装Redmine 2.5.2不全然指南

    我决定在项目中引入Redmine来管理开发任务和计划,至于Redmine的优点,请问度娘或者脑补一下. 互联网搜索到的.基本上都是旧版本号的. 1.2.1 的最多,我要新的啊,所以仅仅好自己来啦. 本 ...

  6. 简单四步開始树莓派上的Docker之旅

    大概这篇博文发表之后,应该算是我个人的第一篇翻译作品了,翻译的可能不是非常到位,望各位看官大刀砍过来. 原文链接:http://resin.io/blog/docker-on-raspberry-pi ...

  7. loadrunner中log的使用初步总结

    1.log的设置方式 . 在 runtime setting中可以设置log的生成方式: 默认的log方式: Enable logging选中,log option是Send messages onl ...

  8. 500 OOPS: chroot

    FTP登录时报错: 1.500 OOPS: chroot 解决方法:关闭SElinux 2.500 OOPS: vsftpd: refusing to run with writable root i ...

  9. OpenWrt中wifidog的配置及各节点页面参数

    修改/etc/wifidog.conf, 只需要修改文件的前半部分, 其他都保持默认 GatewayID default GatewayInterface br-lan GatewayAddress ...

  10. poj 1156 Palindrome

    Palindrome Time Limit: 3000MS   Memory Limit: 65536K Total Submissions: 51631   Accepted: 17768 Desc ...