jQuery通讯录树形节点

所属分类:导航,输入-文件树,选择框

jQuery通讯录树形节点 ie兼容10

数据结构如下:

var obj = {
    "childList": [
        {
            "id": 2,
            "name": "行政部门",
            "parentId": 1,
            "parentIds": "0,1,",
            "childList": [
                {
                    "childList": [],
                    "id": 4,
                    "name": "校长室",
                    "parentId": 2,
                    "parentIds": "0,1,2,",
                    "userList": [
                    {
                    "id": 111,
                   "realName": "杨武1",
                   "userName": "admin",
                   "uuid": "uuidtest1"
               }
                    ]
                },
                {
                    "childList": [],
                    "id": 5,
                    "name": "德育处",
                    "parentId": 2,
                    "parentIds": "0,1,2,",
                    "userList": [
                    {
                    "id": 111,
                   "realName": "杨武(test)2",
                   "userName": "yang",
                   "uuid": "uuidtest2"
               },
               {
               "id": 222,
                   "realName": "杨武(test)3",
                   "userName": "yang",
                   "uuid": "uuidtest2"
               }
                    ]
                }
            ],
            "userList": [
                {
                "id": 333,
                    "realName": "杨武s",
                    "userName": "admin",
                    "uuid": "uuidtest1"
                },
                {
                "id": 444,
                    "realName": "杨武(test)s",
                    "userName": "yang",
                    "uuid": "uuidtest2"
                }
            ]
        },
   {
            "id": 3,
            "name": "学科组",
            "parentId": 1,
            "parentIds": "0,1,",
            "childList": [
                {
                    "id": 6,
                    "name": "文科组",
                    "parentId": 3,
                    "parentIds": "0,1,3,",
                    "childList": [
                    {
                   "id": 6,
                   "name": "语文组",
                   "parentId": 3,
                   "parentIds": "0,1,3,",
                   "childList": [
                   
                   ],
                   "userList": [
                   {
                   "id": 555,
                   "realName": "杨武语文",
                   "userName": "admin",
                   "uuid": "uuidtest1"
               }
                   ]
               },
               {
                   "id": 6,
                   "name": "英语组",
                   "parentId": 3,
                   "parentIds": "0,1,3,",
                   "childList": [],
                   "userList": [
                   {
                   "id": 444,
                   "realName": "杨武英语",
                   "userName": "admin",
                   "uuid": "uuidtest1"
               },
               {
               "id": 777,
                   "realName": "杨武(test)",
                   "userName": "yang",
                   "uuid": "uuidtest2"
               }
                   ]
               }
                    ],
                    "userList": [
                    {
                    "id": 888,
                   "realName": "杨武",
                   "userName": "admin",
                   "uuid": "uuidtest1"
               },
               {
               "id": 999,
                   "realName": "杨武(test)",
                   "userName": "yang",
                   "uuid": "uuidtest2"
               }
                    ]
                },
                {
                    "id": 6,
                    "name": "理科组",
                    "parentId": 3,
                    "parentIds": "0,1,3,",
                    "childList": [],
                    "userList": [
                    {
                    "id": 1010,
                   "realName": "杨武",
                   "userName": "admin",
                   "uuid": "uuidtest1"
               },
               {
               "id": 1111,
                   "realName": "杨武(test)",
                   "userName": "yang",
                   "uuid": "uuidtest2"
               }
                    ]
                }
       ],
            "userList": [
            {
            "id": 1212,
                    "realName": "杨武(test)",
                    "userName": "yang",
                    "uuid": "uuidtest2"
                }
            ]
        }
    ],
    "id": 1,
    "name": "天心岛小学部门",
    "parentId": 0,
    "parentIds": "0,",
    "userList": [
        {
        "id": 1313,
            "realName": "杨武",
            "userName": "admin",
            "uuid": "uuidtest1"
        }
    ]
}

1. 只需要根据树形结构数据就可以自动生成

相关插件-文件树,选择框

树形插件

wdTree是一个轻量级jQuery插件用于创建一个带有嵌套Check Boxe的树形控件。
  文件树
 34176  37

jQuery目录树插件jtree

jQuery目录树、文件树插件jtree,带搜索功能
  文件树
 8966  55

jquery树形菜单插件简单的分类树形菜单代码

jquery树形菜单插件简单的分类树形菜单代码,简单实用。
  文件树
 33681  47

纯手写完成“移动端权限树”插件

实现移动端权限树的全选,半选,以及不选的递归功能
  文件树
 16666  79

讨论这个项目(19)回答他人问题或分享插件使用方法奖励jQ币

    no ifs 0
    2017/8/12 10:38:36

    good

        纯真IT-Kevin0
        2017/9/13 13:39:49
        挺好看的一个插件
    回复
    chase(PHP) 0
    2017/8/7 9:20:18
    Techape 0
    2017/8/3 21:52:10

    版主,这个插件可以集于api接口的json数据初始化树形结构吗?

    回复
    ye_ibl 0
    2017/8/3 17:03:42

    可以用于移动端么

        我们都是好朋友0
        2017/8/4 14:19:59

        移动端的

        海风0
        2017/8/18 16:44:24

        h5的移动和web

    回复
    Unique 0
    2017/7/27 10:31:10
    Let it be 0
    2017/7/14 15:26:15

    有 编辑 删除  添加的功能吗?

        我们都是好朋友0
        2017/7/17 13:45:08

        具体功能可以说一下

        简体字0
        2017/7/25 11:40:38

        可以集于api接口的json数据初始化树形结构啊

    回复
    tomorrow 0
    2017/7/11 8:53:32
    只有我一个人觉得点击全选没反应吗 回复
    杨员外 0
    2017/7/10 16:28:27

    这个试了一下,还可以

    回复
    Gentleman 0
    2017/7/9 12:10:59
    China皇朝网络'商务部 0
    2017/7/7 22:54:09
取消回复