<!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. [HDU1403]Longest Common Substring（后缀数组）

    传送门 求两个串的公共子串(注意,这个公共子串是连续的一段) 把两个串连在一起,中间再加上一个原字符串中不存在的字符,避免过度匹配. 求一遍height,再从height中找满足条件的最大值即可. 为 ...

  2. nyoj 306 二分+dfs

    #include<stdio.h> #include<string.h> #define N 200 int Min(int a,int b) { return a>b? ...

  3. Istio是啥？一文带你彻底了解！

    原标题:Istio是啥?一文带你彻底了解! " 如果你比较关注新兴技术的话,那么很可能在不同的地方听说过 Istio,并且知道它和 Service Mesh 有着牵扯. 这篇文章可以作为了解 ...

  4. Atom编辑器折腾记_(15)JS代码片段补全(插件:javascript-snippets)

    题外话 这款插件就比較重量级了-.用熟悉了写原生JS的效率要提升非常多--并且,不仅支持JS还包括了nodejs snippet javascript-snippets 插件作者: zenorocha ...

  5. 64位oracle数据库用32位plsql developer无法连接问题（无法载入oci.dll）

    在64位操作系统下安装oracle数据库,新下载了64位数据库(假设是32位数据库安装在64位的操作系统上,无论是client还是server端.都不要去选择C:\Program Files (x86 ...

  6. Mongo 中间件 pre find 修改query

    需求:在所有find查询的时候,默认添加查询参数 name:bennman //创建一个query中间件 myMid.js module.exports = function(schema){ //这 ...

  7. 二分图染色模板（P1330 封锁阳光大学）

    二分图染色模板(P1330 封锁阳光大学) 题目描述 曹是一只爱刷街的老曹,暑假期间,他每天都欢快地在阳光大学的校园里刷街.河蟹看到欢快的曹,感到不爽.河蟹决定封锁阳光大学,不让曹刷街. 阳光大学的校 ...

  8. PCB MS SQL 将字符串分割为表变量(表值函数)

    Create FUNCTION [dbo].[SplitTable]( @s varchar(max), --待分拆的字符串 ) --数据分隔符 ),), col varchar(max)) --建立 ...

  9. 动态title

    <html><head><meta charset="uft8"><title>测试title</title></ ...

  10. 使用JQuery制作幻灯片(轮播图）

    1.首先看一下目录结构 images文件夹放所需要播放的图片. js文件夹放jquery库和main.js 2.html代码: <!DOCTYPE html> <html lang= ...