<html>

<body>

    <table>

        <tr>

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

            <th>全选</th>

            <th><input type="checkbox" onclick="fanCheck()" id ="check1"/></th>

            <th>反选</th>

        </tr>

        <tr>

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

            <td>苹果</td>

        </tr>

        <tr>

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

            <td>香蕉</td>

        </tr>

        <tr>

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

            <td>梨</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">

        var isCheckAll = false;

        function swapCheck() {

            if (isCheckAll) {

                $("input[type='checkbox']").prop('checked',false);

                isCheckAll = false;

            } else {

                $("input[type='checkbox']").prop('checked',true);

                $("input[id='check1']").prop('checked',false);

                isCheckAll = true;

            }

        }  

        function fanCheck() {

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

        $(this).prop('checked',!$(this).prop('checked'));

        });

        $("input[id='check']").prop('checked',false);

        $("input[id='check1']").prop('checked',!$(this).prop('checked'));

        }

    </script>

</body>

</html>

不知道用不用的到。。。。

web中的简单全选反选的更多相关文章

  1. 关于Winform下DataGridView中实现checkbox全选反选、同步列表项的处理

    近期接手一个winform 项目,虽然之前有.net 的经验,但是对一些控件的用法还不是很熟悉. 这段时间将会记录一些在工作中遇到的坎坷以及对应的解决办法,写出来与大家分享并希望大神提出更好解决方法来 ...

  2. C# WinForm中实现CheckBox全选反选功能

    今天一群里有人问到这个功能,其实应该挺简单,但提问题的人问题的出发点并没有描述清楚.因此,一个简简单单的需求,就引起了群内热烈的讨论.下面看看这个功能如何去实现,先上效果: 下面直接上代码,请不要在意 ...

  3. bootstrap 中的 iCheck 全选反选功能的实现

    喜欢bootstrap 风格的同学应该知道,iCheck的样式还是很好看的. 官网: http://www.bootcss.com/p/icheck/ 进入正题,iCheck提供了一些方法,可以进行全 ...

  4. vue中的checkbox全选和反选

    前几天有个博客园的朋友问小颖,小颖之前写的vue2.0在table中实现全选和反选  .Vue.js实现checkbox的全选和反选,为什么他将里面的js复制下来,但是实现不了全选和反选.小颖当时看他 ...

  5. JavaScript Web API 全选反选案例

    全选反选 全选和反选功能,在开发中可以说是应用得非常多的,以下通过案例分解,学习如何使用JS实现全选反选功能. 该功能可分为如下三大步骤: 1.全选 1.1 获取父checkbox,注册点击事件 1. ...

  6. React中的全选反选问题

    全选反选问题 1.在state里维护一个数组,例如showArr:[] 2.绑定点击事件的时候将当前这个当选按钮的index加进来 <span className='arrow' onClick ...

  7. html中全选反选

    <!--第一层--> <div class="first"> <div class="first_top"> <img ...

  8. JQuery 全选 反选 获取Table 中指定td的元素值

    //全选 function initTableCheckbox() { var $thr = $('table thead tr'); var $checkAllTh = $('<th>& ...

  9. 用javascript实现全选/反选组件

    以下是本人制作的全选/反选 组件,供广大同行参考.指正: 效果如图: 在实现的过程中,全选和全部取消选中这两个功能较为简单,只需用for循环遍历所有复选框为true或false即可.反选也较为简单,也 ...

随机推荐

  1. 设备指纹识别之User Agent 解析

    设备指纹识别之User Agent 解析User Agent 解析 zoerywzhou@163.com http://www.cnblogs.com/swje/ 作者:Zhouwan 2017-4- ...

  2. javaweb添加拦截器

    js请求后台代码添加拦截器: package com.ctzj.biz.isale.deploy.controller; import java.io.IOException; import java ...

  3. 数据分析与展示——Matplotlib基础绘图函数示例

    Matplotlib库入门 Matplotlib基础绘图函数示例 pyplot基础图表函数概述 函数 说明 plt.plot(x,y,fmt, ...) 绘制一个坐标图 plt.boxplot(dat ...

  4. Spring框架（四）AOP面向切面编程

    一.前言 在以前的项目中,很少去关注spring aop的具体实现与理论,只是简单了解了一下什么是aop具体怎么用,看到了一篇博文写得还不错,就转载来学习一下,博文地址:http://www.cnbl ...

  5. ES6常用语法

    ECMAScript 6(以下简称ES6)是JavaScript语言的下一代标准.因为当前版本的ES6是在2015年发布的,所以又称ECMAScript 2015. 也就是说,ES6就是ES2015. ...

  6. P神的SDFZ考试题 C题

                                                                      探险[问题描述]          探险家小 T 好高兴! X 国要 ...

  7. php-迭代创建级联目录

    方法一代码: path = './a/b/c/d/e/f'; $path_arr = explode('/',$path);//得到数组array('.','a','b','c','d','e','f ...

  8. lesson - 6 课程笔记

    一.df  作用:  显示磁盘分区上的可使用的磁盘空间, 默认显示单位为kb . 可以利用该命令来获取硬盘被占用了多少空间,目前还剩下多少空间的等信息. 选项: -a :包含全部的文件系统 -h :以 ...

  9. MySQL 单实例编译安装 以及多实例安装简介

    这是基本的安装教程,与牛逼的大神无关,或许是牛逼大神不用看就会安装吧. CentOS 6.5 Final  x86_64 一.预安装软件包 1.开发包组合安装 yum groupinstall &qu ...

  10. 从0到上线开发企业级电商项目_前端_01_sublime使用技巧

    一.用户设置 { "color_scheme": "Packages/Color Scheme - Default/Monokai.tmTheme", &quo ...