html checkbox  实现全选/取消全选

<html>

<body>

	<table border="1">

		<tr>

			<th><input type="checkbox" onclick="swapCheck()" /></th>

			<th>Month</th>

			<th>Savings</th>

		</tr>

		<tr>

			<td><input type="checkbox" /></td>

			<td>January</td>

			<td>$100</td>

		</tr>

		<tr>

			<td><input type="checkbox" /></td>

			<td>February</td>

			<td>$150</td>

		</tr>

	</table>

	<script type="text/javascript"

		src="http://apps.bdimg.com/libs/jquery/2.1.1/jquery.min.js"></script>

	<script type="text/javascript">

		//checkbox 全选/取消全选

		var isCheckAll = false;

		function swapCheck() {

			if (isCheckAll) {

				$("input[type='checkbox']").each(function() {

					this.checked = false;

				});

				isCheckAll = false;

			} else {

				$("input[type='checkbox']").each(function() {

					this.checked = true;

				});

				isCheckAll = true;

			}

		}

	</script>

</body>

</html>

效果图：

html checkbox 实现全选/取消全选的更多相关文章

  1. Jquery CheckBox复选框 全选/取消全选 最佳实现方式 参考案例

    <input id="chkAll" type="checkbox" />全选/取消全选</div> <asp:Repeater ...

  2. checkbox全选/取消全选

    //checkbox全选/取消全选 $(function() { $("#checkAll").click(function() { if(this.checked){ $(&qu ...

  3. 【转载】checkbox实现全选/取消全选

    比较简单.好理解的写法,做个备注.查看请前往原地址:http://blog.csdn.net/graceup/article/details/46650781 <html> <bod ...

  4. jQuery--checkbox全选/取消全选

    用JavaScript使页面上的一组checkbox全选/取消全选,逻辑很简单,实现代码也没有太难的语法.但使用jQuery实现则更简单,代码也很简洁,精辟! jQuery版本:1.3.2 <h ...

  5. AngularJS--购物车全选/取消全选功能实现

    刚学习angularJS,于是练习写了一个类似于购物车的全选/取消全选的功能,主要实现的功能有: 1.勾选全选checkbox,列表数据全部被勾选,取消同理,用ng-model实现双向绑定: 2.选中 ...

  6. jQuery 复选框全选/取消全选/反选

    jQuery实现的复选框全选/取消全选/反选及获得选择的值. 完整代码: <!DOCTYPE html> <html> <head> <script type ...

  7. Vue 全选/取消全选，反选/取消反选

    这是一个组件: <template> <div> <div> <input type="checkbox" v-model="i ...

  8. vue实现功能 单选 取消单选 全选 取消全选

    vue实现功能 单选 取消单选 全选 取消全选 代码部分 <template> <div class=""> <h1>全选框</h1> ...

  9. jquery checkbox勾选取消勾选的诡异问题

    jquery checkbox勾选/取消勾选的诡异问题jquery checkbox勾选/取消勾选的诡异问题 <form>        你爱好的运动是?<input type=&q ...

随机推荐

  1. 在表达式和脚本中将bean实例暴露出来

    默认情况下,在activiti.cfg.xml中的所有bean和Spring配置文件中的所有bean都可以用于表达式和脚本.如果要限制配置文件中的bean的可见性,可以在流程引擎配置文件中配置一个名为 ...

  2. 如何设置Google Chrome的界面显示语言

    昨天不小心,把Chrome浏览器的界面语言换成了中文, 结果换不回去英文了!!! 这是为啥呀? 我本来使用的是英文界面,换成中文却不让换回原来的语言,这怎么也说不过去吧. Google了一会子也没找到 ...

  3. AC日记——[HNOI2008]越狱 bzoj 1008

    1008 思路: 越狱情况=总情况-不越狱情况: 代码: #include <cstdio> #include <cstring> #include <iostream& ...

  4. mongodb复制集搭建

    注:mongodb当前版本是3.4.3 1.准备三个虚拟机做服务器 192.168.168.129:27017 192.168.168.130:27017 192.168.168.131:27017 ...

  5. 训练指南 UVA - 11090（最短路BellmanFord+ 二分判负环）

    layout: post title: 训练指南 UVA - 11090(最短路BellmanFord+ 二分判负环) author: "luowentaoaa" catalog: ...

  6. BZOJ 1878 [SDOI2009]HH的项链（扫描线+树状数组）

    [题目链接] http://www.lydsy.com/JudgeOnline/problem.php?id=1878 [题目大意] 给出一个数列,给出m个查询,每次查询一个区间中不相同的数字个数 [ ...

  7. 【最短路】【Heap-Dijkstra】【分层图】bzoj2662 [BeiJing wc2012]冻结

    裸的分层图最短路. #include<cstdio> #include<cstring> #include<queue> #include<algorithm ...

  8. 【R笔记】glm函数报错原因及解析

    R语言glm函数学习:  [转载时请注明来源]:http://www.cnblogs.com/runner-ljt/ Ljt 作为一个初学者,水平有限,欢迎交流指正. glm函数介绍: glm(for ...

  9. Arena | 用Excel设计的RPG游戏

    文章目录 写在前面 支持的软件 下载地址 游戏界面截图 写在前面 你在用Excel做报表的时候,世界的某个角落,有位大神早就用它做出了一款RPG游戏--Arena.xlsm 加拿大大学生Cary Wa ...

  10. Entity Framework part2

    EF原理以XML方式打开edmx文件,这个XML的文件主要包含两大部分:Runtime是类模型部分,Designer是VS中的图形界面重点讨论的是Runtime部分,又分为三大部分:SSDL数据模型部 ...