<!DOCTYPE html>

<html>

<head>

    <title></title>

    <script src="http://my.csdn.net/assets2/js/libs/jquery-1.9.0.min.js" type="text/javascript"></script>

    <script type="text/javascript">

        $(function () {

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

                var myid = $(this).attr("id");

                //alert(myid);

                var isSel = $(this).is(":checked");

                selectChkbox(0, myid, isSel);

                selectParentChkbox($(this));

            });

        });

        //变更子节点

        function selectChkbox(n,parentid, isSel) {

            var len = $("input[type='checkbox']").length;

            for (var i = n; i < len; i++) {

                var inp = $("input[type='checkbox']").eq(i);

                var pid = inp.attr("data-parent");

                if (parentid == pid) {

                    if (isSel) {

                        inp.prop("checked", true);

                    } else {

                        inp.prop("checked", false);

                    }

                    selectChkbox(i, inp.attr("id"), isSel);

                }

            }

        }

        //变更父节点

        function selectParentChkbox(clickINP) {

            var parentid = clickINP.attr("data-parent");

            if (parentid != "null") {

                if (!clickINP.is(":checked")) {

                    selectParentChkF(parentid);

                } else {

                    selectParentChkT(parentid);

                }

            }

        }

        function selectParentChkF(parentid) {

            $("#" + parentid).prop("checked", false);

            parentid = $("#" + parentid).attr("data-parent");

            if (parentid != "null")

                selectParentChkF(parentid);

        }

        function selectParentChkT(parentid) {

            var parentSel = true;

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

                var pid = $(this).attr("data-parent");

                if (parentid == pid) {

                    if (!$(this).is(":checked")) {

                        parentSel = false;

                    }

                }

            });

            if (parentSel) {

                $("#" + parentid).prop("checked", true);

                parentid = $("#" + parentid).attr("data-parent");

                if (parentid != "null")

                    selectParentChkT(parentid);

            } else {

                selectParentChkF(parentid);

            }

        }

    </script>

</head>

<body>

 <div>

  <div>A<input id="A" data-parent="null" type="checkbox" /></div>

  <div style=" margin-left:16px;">B<input id="B" data-parent="A" type="checkbox" /></div>

  <div style=" margin-left:32px;">B-1<input id="B-1" data-parent="B" type="checkbox" /></div>

  <div style=" margin-left:32px;">B-2<input id="B-2" data-parent="B" type="checkbox" /></div>

  <div style=" margin-left:48px;">B-2-1<input id="B-2-1" data-parent="B-2" type="checkbox" /></div>

  <div style=" margin-left:48px;">B-2-2<input id="B-2-2" data-parent="B-2" type="checkbox" /></div>

  <div style=" margin-left:16px;">C<input id="C" data-parent="A" type="checkbox" /></div>

  <div style=" margin-left:32px;">D<input id="D" data-parent="C" type="checkbox" /></div>

  <div style=" margin-left:32px;">E<input id="E" data-parent="C" type="checkbox" /></div>

 </div>

</body>

</html>

树checkbox选择jquery实例的更多相关文章

  1. 转：zTree树控件入门之checkbox：如何动态设置节点的checkbox选择框启用与禁用状态（chkDisabled)

    当一棵树的部分节点根据登入用户角色不同而决定是否启用节点前的checkbox选择框的时候,我们应该如何做呢?也或者如何在页面加载的时候动态根据当前登入用户角色动态切换节点前的checkbox的禁用状态 ...

  2. checkbox全选，反选，取消选择 jquery

    checkbox全选,反选,取消选择 jquery. //checkbox全部选择 $(":checkbox[name='osfipin']").each(function(){ ...

  3. 基础 jQuery 实例

    基础 jQuery 实例 jQuery 原则: 由于 jQuery 是为处理 HTML 事件而特别设计的,那么当您遵循以下原则时,您的代码会更恰当且更易维护: 把所有 jQuery 代码置于事件处理函 ...

  4. 值得 Web 开发人员学习的20个 jQuery 实例教程

    这篇文章挑选了20个优秀的 jQuery 实例教程,这些 jQuery 教程将帮助你把你的网站提升到一个更高的水平.其中,既有网站中常用功能的的解决方案,也有极具吸引力的亮点功能的实现方法,相信通过对 ...

  5. jQuery实例——jQuery实现联动下拉列表查询框--转http://www.cnblogs.com/picaso/archive/2012/04/08/2437442.html#undefined

    jQuery实例--jQuery实现联动下拉列表查询框   在查询与列表显示的时候经常用到联动列表显示,比如一级选项是国家,二级选项是省,三级是市,这样的联动是联系的实时导出的,比如你不可能选择了四川 ...

  6. cocos2dx2.2.2登录场景中Checkbox选择框的实现

    在前两篇文章中,我们介绍了在注册场景中需要用到的输入框及弹出框的实现方式,这两篇文章中介绍的内容在登录场景同样会用到.而我们经常会在登录场景中见到的另一种元素就是自动登录或者记住密码的Checkbox ...

  7. jQuery使用（十一）：jQuery实例遍历与索引

    each() children() index() 一.jQuery实例遍历方法each() jQuery实例上的each()方法规定要运行的函数,并且给函数传入两个参数:index,element. ...

  8. 三种动态加载js的jquery实例代码另附去除js方法

    !-- 这里为你提供了三种动态加载js的jquery实例代码哦,由于jquery是为用户提供方便的,所以利用jquery动态加载文件只要一句话$.getscript("test.js&quo ...

  9. JQuery中_Radio、DropDownList、Checkbox选择控件的处理

    Radio  1.获取选中值,三种方法都可以: $('input:radio:checked').val(): $("input[type='radio']:checked").v ...

随机推荐

  1. 「BZOJ3065」带插入区间第K小值 替罪羊树×线段树

    题目描述 从前有\(n\)只跳蚤排成一行做早操,每只跳蚤都有自己的一个弹跳力\(a_i\).跳蚤国王看着这些跳蚤国欣欣向荣的情景,感到非常高兴.这时跳蚤国王决定理性愉悦一下,查询区间\(k\)小值.他 ...

  2. Palindromes _easy version（reverse)

    Problem Description “回文串”是一个正读和反读都一样的字符串,比如“level”或者“noon”等等就是回文串.请写一个程序判断读入的字符串是否是“回文”.   Input 输入包 ...

  3. python依赖文件的生成requirement.txt

    移到你的环境中 pip freeze > requirement.txt

  4. Qt 学习之路 2（9）：资源文件

    Qt 学习之路 2(9):资源文件  豆子  2012年8月31日  Qt 学习之路 2  62条评论 上一章节中我们介绍了如何使用QAction添加动作.其中,我们使用QIcon加载了一张 png ...

  5. Vscode 隐藏 工作区中的目录

    { "files.exclude": { "**/.git": true, "**/.svn": true, "**/.hg&qu ...

  6. P2596 [ZJOI2006]书架（splay）

    [题目链接] https://www.luogu.org/problemnew/show/P2596 平衡树,需支持五个操作: 1. 将某元素置顶:将元素旋到根,然后将左子树合并到该元素的后继 2. ...

  7. POJ 2421 Constructing Roads（最小生成树）

    Description There are N villages, which are numbered from 1 to N, and you should build some roads su ...

  8. django 自带的验证功能

    django.contrib.auth提供了很多验证方法 authenticate(): 提供了用户认证,在自带的数据库表中验证用户名和密码,需要username和password两个关键字参数 如果 ...

  9. java thread start到run：C++源码分析

    转:https://hunterzhao.io/post/2018/06/11/hotspot-explore-inside-java-thread-run/ 整体流程 java new Thread ...

  10. ssh两台主机建立信任关系

    A主机(10.104.11.107)   B主机(10.104.11.128) A: ssh-keygen -t rsa [root@H0f .ssh]# ssh-keygen -t rsa Gene ...