<!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. spring整合dubbo[单机版]

    Spring整合Dubbo,这个是用xml配置的 (方式一) 来梳理下步骤: 1. 安装zookeeper,在进行简单配置[这里使用单机模式,不用集群] 2. 创建maven项目,构建项目结构 3. ...

  2. C# 模拟 HTTP POST请求

    /// <summary> /// 用于以 POST 方式向目标地址提交表达数据 /// 使用 application/x-www-form-urlencoded 编码方式 /// 不支持 ...

  3. 2019-4-23 plan

    需要制作springcloud es6的技术文档和demo

  4. Lintcode174-Remove Nth Node From End of List-Easy

    174. Remove Nth Node From End of List Given a linked list, remove the nth node from the end of list ...

  5. 记flask连接容联云时提示172001，网络错误

    直接用sms.py发送没有问题,直接从写好的注册页面发送就不行.在网上查了不少方法,试过了依然没用,结果换了一个网络就好了,估计是部分网络无法正常发送..后来问了下是环境问题,开发环境不稳定

  6. python小游戏

    import time,random # 需要的数据和变量放在开头player_list = ['[狂血战士]','[森林箭手]','[光明骑士]','[独行剑客]','[格斗大师]','[枪弹专家] ...

  7. Java问题解决："错误: 找不到或无法加载主类"

    参考资料:https://www.cnblogs.com/wangxiaoha/p/6293340.html 场景: 使用java命令运行.class文件时出现:“错误: 找不到或无法加载主类”: 解 ...

  8. 学习笔记78—三大统计相关系数：Pearson、Spearman秩相关系数、kendall等级相关系数

    ****************************************************** 如有谬误,请联系指正.转载请注明出处. 联系方式: e-mail: heyi9069@gm ...

  9. 学习笔记70—Photoshop画齿轮

    具体步骤如下: 1)选择多边形工具: 2)设置齿轮个数及颜色相应参数: 3)画出模型: 4)找到上图模型的中心 (借助:ctrl + T),选择椭圆工具,并 长按Shift+Alt, 画出圆: 5) ...

  10. vim实现实时自动保存

    进https://www.vim.org/scripts/script.php?script_id=4521网站下载vim -auto-save wget  https://www.vim.org/s ...