<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

    <style>

        table{

            margin:100px auto;

            border-spacing: 0;

            background-color: #cccccc;

        }

        td{

            width: 100px;

            height: 50px;

            text-align: center;

            background-color: #ff0;

        }

    </style>

</head>

<body>

    <table>

        <tr>

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

            <th>T1</th>

            <th>T2</th>

            <th>T3</th>

        </tr>

        <tr>

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

            <td>A1</td>

            <td>A2</td>

            <td>A3</td>

        </tr>

        <tr>

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

            <td>B1</td>

            <td>B2</td>

            <td>B3</td>

        </tr>

        <tr>

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

            <td>C1</td>

            <td>C2</td>

            <td>C3</td>

        </tr>

    </table>

    <script src="https://code.jquery.com/jquery-1.10.1.min.js"></script>

    <script>

        $(function () {

            $("th>input").click(function () {

                $("tr input").prop("checked",$(this).prop("checked"));

            });

            $("td input").click(

                function () {

                    var allc = $("td input").length;

                    var checkedc = $("td input:checked").length;

                    if(allc == checkedc){

                        $("th>input").prop("checked",true);

                    }

                    else{

                        $("th>input").prop("checked",false);

                    }

                }

            );

        });

    </script>

</body>

</html>

　　

jQuery实现菜单全选/不选的更多相关文章

  1. jQuery/javascript实现全选全不选

    <html> <head> <meta charset="utf-8"> <title>Checkbox的练习</title& ...

  2. jQuery实现CheckBox全选、全不选

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  3. jQuery设置checkbox全选（区别jQuery版本）

    jQuery设置checkbox全选在网上有各种文章介绍,但是为什么在我们用他们的代码的时候就没有效果呢? 如果你的代码一点错误都没有,先不要急着怀疑人家代码的正确性,也许只是人家跟你用的jQuery ...

  4. jQuery实现的全选、反选和不选功能

    适用于网页多选后需要进行批量操作的场景(如批量删除等).如有问题希望大家可以指正.谢谢~~ HTML 我们的页面上有一个歌曲列表,列出多行歌曲名称,并匹配复选框供用户选择,并且在列表下方有一排操作按钮 ...

  5. jquery中checkbox全选失效的解决方法

    这篇文章主要介绍了jquery中checkbox全选失效的解决方法,需要的朋友可以参考下     如果你使用jQuery 1.6 ,代码if ( $(elem).attr(“checked”) ),将 ...

  6. 雷林鹏分享：jQuery EasyUI 树形菜单 - 创建带复选框的树形菜单

    jQuery EasyUI 树形菜单 - 创建带复选框的树形菜单 easyui 的树(Tree)插件允许您创建一个复选框树.如果您点击一个节点的复选框,这个点击的节点信息将向上和向下继承.例如:点击 ...

  7. jQuery实现的全选、反选和获取当前所有选中的值功能

    链接: jQuery实现的全选.反选和获取当前所有选中的值功能 <ul id="list"> <li><label><input type ...

  8. jquery 1.9版本下复选框 全选/取消实现

    http://zhangzhaoaaa.iteye.com/blog/1914497 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Tran ...

  9. jquery中的全选，全不选

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

随机推荐

  1. Spring Boot静态资源处理

    Spring Boot静态资源处理 8.8 Spring Boot静态资源处理 当使用Spring Boot来开发一个完整的系统时,我们往往需要用到前端页面,这就不可或缺地需要访问到静态资源,比如图片 ...

  2. Java重载和覆盖

    重写 Overriding 如果在子类中定义某方法与其父类有相同的名称和参数,我们说该方法被重写 (Overriding) 1.参数列表必须完全与被重写的方法相同,否则不能称其为重写而是重载. 2.返 ...

  3. faster-rcnn代码阅读2

    二.训练 接下来回到train.py第160行,通过调用sw.train_model方法进行训练: def train_model(self, max_iters): ""&quo ...

  4. [Angulalr] Speed Up Reducer Development Using Ngrx Schematics

    When we use NGRX, we need to create some bolipates. Now with Angulalr6, we can use CLI to generate t ...

  5. 基于Windows Azure 安装 SharePoint 2010简体中文语言包

    在Windows Azure上安装的Windows Server默认是英文版本的,当时安装的SharePoint也是英文版的,为方便使用,决定安装中文的语言包,具体过程如下: 1. 安装 Window ...

  6. android开发之使用SQLite数据库(db文件)

    在开发中,有时须要使用db文件数据库.所以就须要将其导入项目,再将其使用程序写入到应用的db文件下使用. 代码非常easy.能够拿来直接使用. 要使用须要两个步骤: 1.创建raw文件.导入db文件. ...

  7. 黑马程序猿——————java基础

    一.软件开发 软件是什么? 软件是简单的来说,计算机数据和指令的集合,数据(比方年龄,性别).指令及时告诉计算机怎样对他进行处理.计算机但是没有人那么聪明啊! 二.图形化界面(GUI),主要特点就是. ...

  8. Hadoop - YARN 启动流程

       一  YARN的启动流程                                                                 watermark/2/text/aHR ...

  9. Coursera Algorithms week2 栈和队列 练习测验: Queue with two stacks

    题目原文: Implement a queue with two stacks so that each queue operations takes a constant amortized num ...

  10. element快速开发建站的动态UI------优

    网站快速成型工具 只为这样的你:  Element,一套为开发者.设计师和产品经理准备的基于 Vue 2.0 的组件库,提供了配套设计资源,帮助你的网站快速成型 http://element.elem ...