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. Selenium2+python自动化36-判断元素存在【转载】

    前言 最近有很多小伙伴在问如何判断一个元素是否存在,这个方法在selenium里面是没有的,需要自己写咯. 元素不存在的话,操作元素会报错,或者元素有多个,不唯一的时候也会报错.本篇介绍两种判断元素存 ...

  2. python 模拟登陆园子

    主要用到了python cookielib,urllib2,urllib这3个模块,python 不亏是具有 先天做 爬虫的特质,废话多说直接上代码 #coding: utf- import sys ...

  3. 从dao层查出的数据到页面时数值都是零的异常

    异常问题: IllegalArgumentException: argument type mismatch at cn.tedu.utils.BeanListHandler.handle(BeanL ...

  4. 对DDD中领域服务的理解

    CZ 能不能清晰具体区分service和实体的区别 网上有人用DCI来解决 不知道对不对 STST 我复习下DDD中的服务的概念了参与讨论啊CZ 这个我也看过 但是太过于笼统 STST STST 复习 ...

  5. HDU 2141 Can you find it?【二分查找是否存在ai+bj+ck=x】

    Give you three sequences of numbers A, B, C, then we give you a number X. Now you need to calculate ...

  6. 2017 ACM-ICPC 亚洲区（青岛赛区）网络赛 1010

    #include<iostream> #include<cstdio> #include<cmath> #include<cstring> #inclu ...

  7. Linux命令之free

    free [选项] 显示系统中未使用和使用的内存情况,包括物理内存.交换区内存(swap)和内核缓冲区内存.共享内存将被忽略. (1).选项 -b,-k,-m,-g 以Byte,KB,MB,GB为单位 ...

  8. Axis2 解析

    代码生成    Java to WSDL:WSDL to Java:XSD to WSDL:WSDL to XML:WSDL to SOAP:WSDL to Service: Apache Axis2 ...

  9. AGC 025 B - RGB Coloring

    B - RGB Coloring Time limit : 2sec / Memory limit : 1024MB Score : 700 points Problem Statement Taka ...

  10. [Contest20180311]朋友

    是毒瘤的friends呢~ 注意到“产生感情”和后缀自动机的$Right$集合定义很像,所以先对所有串建广义sam,那么一个节点$s$里的所有串都互相产生感情,而从起点走到$s$走最长路所经过的节点里 ...