插件地址:http://www.ztree.me

数据:[{"id":1,"pId":-1,"name":"根目录"},{"id":2,"pId":1,"name":"子目录1"}]

  1. <ul id="tree" class="ztree" style="padding: 0px 0px;"></ul>

 

  1. $.ajax({
  2. method: 'get',
  3. url: 'api/ZTree/Get',
  4. contentType: "application/json; charset=utf-8",
  5. success: function (data) {
  6.  
  7. $.fn.zTree.init($("#tree"), {
  8. view: {
  9. showIcon: true,
  10. showLine: true,
  11. showTitle: true
  12. },
  13. data: {
  14. simpleData: {
  15. enable: true,
  16. idKey: "id",
  17. pIdKey: "pId",
  18. rootPId:-1
  19. },
  20. key: {
  21. title: "Info"
  22. }
  23. },
  24.  
  25. callback: {
  26. onClick: function (event,treeId,treeNode,clickFlag) {
  27. console.log(treeNode)
  28. }
  29. }
  30. }, eval(data));
  31. }
  32. });

 

  1. var cid = $.request.queryString["mid"];
  2. if (cid != null) {
  3. var treeObj = $.fn.zTree.getZTreeObj("tree_Doc");
  4. var node = treeObj.getNodeByParam("id", cid, null);
  5. if (node != null) {
  6. treeObj.selectNode(node);
  7. }
  8. }

 

  1. $.request = (function () {
  2. var apiMap = {};
  3. function request(queryStr) {
  4. var api = {};
  5. if (apiMap[queryStr]) { return apiMap[queryStr]; }
  6. api.queryString = (function () {
  7. var urlParams = {};
  8. var e,
  9. d = function (s) { return decodeURIComponent(s.replace(/\+/g, " ")); },
  10. q = queryStr.substring(queryStr.indexOf('?') + 1),
  11. r = /([^&=]+)=?([^&]*)/g;
  12. while (e = r.exec(q)) urlParams[d(e[1])] = d(e[2]);
  13. return urlParams;
  14. })();
  15. api.getUrl = function () {
  16. var url = queryStr.substring(0, queryStr.indexOf('?') + 1);
  17. for (var p in api.queryString) { url += p + '=' + api.queryString[p] + "&"; }
  18. if (url.lastIndexOf('&') == url.length - 1) { return url.substring(0, url.lastIndexOf('&')); }
  19. return url;
  20. }
  21. apiMap[queryStr] = api;
  22. return api;
  23. }
  24. $.extend(request, request(window.location.href));
  25. return request;
  26. })();

$.request

ztree jquery 树 控件的更多相关文章

  1. Jquery树控件ZTree异步加载

    异步加载的意思就是: 当点击展开树节点时,才去请求后台action返回点击节点的子节点数据并加载. 这里面主要设计ztree的setting变量的async属性设置: var setting = { ...

  2. 转:zTree树控件扩展篇:巧用zTree控件实现文本框输入关键词自动模糊查找zTree树节点实现模糊匹配下拉选择效果

    是否可以借助于zTree实现文本框输入关键词自动模糊匹配zTree下拉树,然后选择下拉树内节点显示在文本框内且隐藏下拉树. 看到这个需求脑子里头大致已经想到了要如何实现这样一个需求,当时是限于时间问题 ...

  3. jQuery树形控件zTree使用小结

    作者:Fonour 字体:[增加 减小] 类型:转载 时间:2016-08-02我要评论 这篇文章主要为大家详细介绍了jQuery树形控件zTree使用方法,zTree树插件的基本使用方法,感兴趣的小 ...

  4. jQuery树形控件zTree使用

    http://www.cnblogs.com/AutumnRhyme/p/5915769.html .................................................. ...

  5. 转:zTree树控件实战篇:针对多个下拉加载zTree树应该如何做出合理的配置

    今天有一个zTree的朋友遇到一个非常棘手的问题,才研究zTree树控件两天就被上头催着看成果,很是苦恼.他面对的问题就是页面内多个地方需要下拉在其文本框下方加载zTree树,由于对zTree下拉加载 ...

  6. JS组件系列——Bootstrap 树控件使用经验分享

    前言:很多时候我们在项目中需要用到树,有些树仅仅是展示层级关系,有些树是为了展示和编辑层级关系,还有些树是为了选中项然后其他地方调用选中项.不管怎么样,树控件都是很多项目里面不可或缺的组件之一.今天, ...

  7. 基于MVC4+EasyUI的Web开发框架经验总结(2)- 使用EasyUI的树控件构建Web界面

    最近花了不少时间在重构和进一步提炼我的Web开发框架上,力求在用户体验和界面设计方面,和Winform开发框架保持一致,而在Web上,我主要采用EasyUI的前端界面处理技术,走MVC的技术路线,在重 ...

  8. js插件---Bootstrap 树控件

    js插件---Bootstrap 树控件 一.总结 一句话总结:可以直接用gojs,或者搜索js,jquery的树控件,或者bootstrap树控件,一大堆 gojs 二.JS组件系列——Bootst ...

  9. Bootstrap树控件(Tree控件组件)使用经验分享

    前言:很多时候我们在项目中需要用到树,有些树仅仅是展示层级关系,有些树是为了展示和编辑层级关系,还有些树是为了选中项然后其他地方调用选中项.不管怎么样,树控件都是很多项目里面不可或缺的组件之一.今天, ...

随机推荐

  1. Linux下Tomcat开机自动启动

    linux下tomcat开机自动启动有两种方法,一种是简单,一种是复杂而又专业的,使用shell脚本要实现,我们一般推荐shell脚本启动方式.下面我们分别介绍这两种方法. 1.shell脚本启动 众 ...

  2. shell脚本之正则表达和文本处理(文本处理三剑客:1、grep 2、sed 3、awk)

    文本处理三剑客:1.grep  2.sed  3.awk 一.grep:(过滤) grep的使用,主要的参数有: -n  :显示行号:-o  :只显示匹配的内容-q  :静默模式,没有任何输出,得用e ...

  3. ubuntu16.04下fcitx无法在QT Creator输入中文解决办法

    我的博客新地址:www.liuquanhao.com ------------------------------------------------------ Qt creator无法用fcitx ...

  4. Android开发工具--AndroidStudio

    1.Android studio更改快捷键File->setttings  搜索key map就可以更改成自己喜欢的会计键风格了

  5. [ 总结 ] Linux kickstart 无人值守安装系统构建过程

    环境:Vmare + Linux虚拟机 注意:网卡桥接

  6. 【SQL】全关系操作

    1.消除重复 - DISTINCT SQL语句中默认的是,重复的元祖可以多次的显示.如果希望消除重复,需要DISTINCT关键字. 注:消除重复需要排序,所以代价高.在需要高效率时要谨慎. SELEC ...

  7. hdu 1364(差分约束)

    King Time Limit: 1000MS   Memory Limit: 10000K Total Submissions: 12056   Accepted: 4397 Description ...

  8. 自动清空Tomcat日志的办法

    cd /usr/local/tomcat7/logs #清空日志 echo > catalina.out vi r.sh #!/bin/sh ########################## ...

  9. Ubuntu 16.04下开启Mysql 3306端口远程访问

    原文地址:传送门 0. 前言 网上看到很多开启Mysql远程访问端口,修改的配置文件我都没有找到. 特意查看了我的Linux版本 $ sudo lsb_release -a 显示如下: Distrib ...

  10. 关闭浏览器session就被干掉的假象的问题

    当在前台取出session时,关闭浏览器后再次访问服务器,这时服务器返回了一个null,此时的返回的session并非之前的那个session而是一个新的session. -->先来看看sess ...