<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>全选和全不选以及反选</title>
<script src="../js/jquery-1.8.3.js"></script>
<script>
$(function() {
//全选事件
$("#checkedAll").click(function() {
$(".checkedOne").attr("checked",this.checked);
});
$("#reSelect").click(function() {
$(".checkedOne").each(function() {
this.checked = !this.checked;
});
}); });
</script>
</head>
<body>
<table id="tbl" border="1" border-collapse="collapse" align="center" cellspacing="0" cellpadding="5" width="400" height="20">
<thead>
<tr>
<th><input type = "checkbox" id="checkedAll">全选</input></th>
<th>编号</th><th>姓名</th><th>年龄</th>
</tr>
</thead>
<tbody>
<tr>
<td><input type="checkbox" class="checkedOne"/></td>
<td>1</td><td>张三</td><td>12</td>
</tr>
<tr>
<td><input type="checkbox" class="checkedOne"/></td>
<td>2</td><td>李四</td><td>22</td>
</tr>
<tr>
<td><input type="checkbox" class="checkedOne" /></td>
<td>3</td><td>王五</td><td>13</td>
</tr>
<tr>
<td><input type="checkbox" class="checkedOne"/></td>
<td>4</td><td>马六</td><td>14</td>
</tr>
<tr>
<td><input type="checkbox" class="checkedOne"/></td>
<td>5</td><td>伍六七</td><td>17</td>
</tr>
<tr>
<td><input type="checkbox" class="checkedOne"/></td>
<td>6</td><td>梅花十三</td><td>17</td>
</tr>
<tr>
<td colspan=4><input type="button" value="反选" id="reSelect" /></td>
</tr>
</tbody>
</table>
</body>
</html>

JQuery案例二:实现全选、全不选和反选的更多相关文章

  1. 全选全不选案例table表格

    全选全不选案例table表格 案例一纯table表格 <table class="table table-bordered"> <thead class=&quo ...

  2. jquery之全选全不选

    <input type="checkbox" onclick="selall(this)" />全选/全不选 <input type=&quo ...

  3. jquery实现全选、不选、反选的两种方法

    在取复选框checkbox的属性checked属性值时,发现一个问题,就是当用attr取值时,真的为"checked",假的为"undefined";当用pro ...

  4. Dynamic CRM 2013学习笔记(二十六)报表设计:Reporting Service报表 动态参数、参数多选全选、动态列、动态显示行字体颜色

    上次介绍过CRM里开始报表的一些注意事项:Dynamic CRM 2013学习笔记(十五)报表入门.开发工具及注意事项,本文继续介绍报表里的一些动态效果:动态显示参数,参数是从数据库里查询出来的:参数 ...

  5. jQuery/javascript实现全选全不选

    <html> <head> <meta charset="utf-8"> <title>Checkbox的练习</title& ...

  6. jQuery实现Checkbox中项目开发全选全不选的使用

    <html> <head> <meta charset="utf-8"> <title>Checkbox的练习</title& ...

  7. 利用jQuery实现CheckBox全选/全不选/反选

    转自:http://www.cnblogs.com/linjiqin/p/3148259.html jQuery有些版本中实现CheckBox全选/全不选/反选会有bug,经测试jquery-1.3. ...

  8. jquery的全选/全不选/反选以及attr添加checked属性失败的解决办法

    如下图: <head> <title></title> <style type="text/css"> div { border: ...

  9. 【七】jquery之属性attr、 removeAttr、prop[全选全不选及反选]

    全选全不选 界面: 代码: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> ...

随机推荐

  1. iOS SDWebImage知识点

    1.clear 和 clean clear 先把之前的缓存文件夹删除掉,然后新建一个文件夹 clean 先删除过期的文件,然后计算剩余缓存文件的大小 currentSize > maxSize, ...

  2. Android中获得网络状况的实现

    要得知网络状况就是要用networkinfo类这个类名还是把这个类的意思表达的很清晰的,network是网络,info是状况.判断是否有网用到了这个类的IsAvailable方法,这个方法返回的是这个 ...

  3. Flutter去除右上角Debug标签

    void main(){ runApp(new MyApp()); } class MyApp extends StatefulWidget { @override _MyAppState creat ...

  4. 每天一套题打卡|河南省第十一届ACM/ICPC

    A 计划日 题意:已知李明在YYYY年MM月DD日星期W订了学习计划,现在想看看李明N天后的完成情况和个人总结,你能告诉我那天的日期和星期几吗? 模拟日期计算: 计算星期可以用基姆拉尔森公式 //中国 ...

  5. <抽象工厂>比<工厂方法>多了啥

    前言:仅当复习讨论,写得不好,多多指教! 上一篇文章<比多了啥>介绍了简单工厂模式和工厂方法模式.本篇文章则讲最后一个工厂----抽象工厂.如果对工厂方法比较模糊的,可以返回上一篇文章复习 ...

  6. angular + socket.io+nodejs

    一.服务器端: 基本和nodejs工程相同 https://www.cnblogs.com/xuanmanstein/p/10509445.html 安装socket.io npm i --save ...

  7. gcc使用及动静态库制作

    一. GCC的使用 1. GCC的编译过程 (1)预处理(cpp)gcc -E(输出问价通常以 .i 结尾),将头文件展开,宏替换等操作: (2)编译器(gcc)gcc -S(输出问价以 .s 结尾) ...

  8. locust启动命令

    locust运行测试脚本 locust -f .\load_test.py --host=https://www.baidu.com -f 指定性能测试脚本文件. --host 指定被测试应用的URL ...

  9. 性能测试系列-java gc调优

    性能测试中除了需要做好性能测试外,我们还需要做性能测试后的,性能调优,需要发现性能问题,也需要做性能调优,在做性能调优中,jvm的性能调优是经常遇到的一个. 随着jdk版本的迅速变化,jdk里面的GC ...

  10. ElasticSearch 6.2 Mapping参数说明及text类型字段聚合查询配置

    背景: 由于本人使用的是6.0以上的版本es,在使用发现很多中文博客对于mapping参数的说明已过时.ES6.0以后有很多参数变化. 现我根据官网总结mapping最新的参数,希望能对大家有用处. ...