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. 微信支付报错：app没有获取微信支付权限

    调试微信支付的时候报错: Array( [return_code] => FAIL [return_msg] => 您没有APP支付权限) 查询了,发现自己将之前的公众号支付的APPID一 ...

  2. 如何用sqlplus执行sql脚本，且让出错后及时退出sqlplus

    按sqlplus常规作法,是要登陆,输入用户名和密码才能操作的. 并且,如果不作特别设置,SQL脚本里的部门语句有问题后,它还是会坚持执行完成其余的SQL的. 为了安全和自动化,得改进一下了. sql ...

  3. xunsearch如何按照ID排序

    你ini再建一个字段id_tmp 类型type=numeric 重建索引的时候 数据源 加一个主键id的别名 id, id as id_tmp 排序的时候按照id_tmp排序

  4. HDU 2199 Can you solve this equation? 【浮点数二分求方程解】

    Now,given the equation 8x^4 + 7x^3 + 2x^2 + 3x + 6 == Y,can you find its solution between 0 and 100; ...

  5. CodeForces 669B

    链接:http://codeforces.com/problemset/problem/669/B 本文链接:http://www.cnblogs.com/Ash-ly/p/5443086.html ...

  6. 【bzoj2763】[JLOI2011]飞行路线 （分层图最短路）（优先队列dij）

    [bzoj2763][JLOI2011]飞行路线 2014年3月25日1,7260 Description Alice和Bob现在要乘飞机旅行,他们选择了一家相对便宜的航空公司.该航空公司一共在n个城 ...

  7. CentOS下MySQL主从复制，读写分离

    1.环境:所有系统都是CentOS5.5 mysql-5.6.31-2.el5,MySQL中都没有数据 主服务器IP为192.168.128.230 从服务器IP为192.168.128.235 代理 ...

  8. luogu P4012 深海机器人问题

    luogu P4012 深海机器人问题 // luogu-judger-enable-o2 #include<queue> #include<cstdio> #include& ...

  9. 【主席树】bzoj2588 Spoj 10628. Count on a tree

    每个点的主席树的root是从其父转移来的.询问的时候用U+V-LCA-FA(LCA)即可. #include<cstdio> #include<algorithm> using ...

  10. 【斜率优化】BZOJ1096-[ZJOI2007]仓库建设

    [题目大意] 有n个工厂编号分别为1-n,第i个仓库库存量为p[i],距离第1个仓库的距离为x[i](x[1]=0).在每一个工厂建立一个仓库费用为c[i],没有建立仓库的工厂只能往编号大于它的仓库运 ...