ztree 树怎么写简单树关键代码

只上关键代码，花了我一天半的时间研究，不容易啊！！！！！！！！！！！！！！！！！！！！！！！

//******************************************树树树ztree********************************************var columnTree;var setting = {check: {enable: true,chkStyle: "radio",radioType: "all"},view: {dblClickExpand: false,},data: {key:{name:"name"},simpleData: {enable: true,idKey: "id",//如果组装的数据跟树的数据结构一样则不用写idkey和pidkeypIdKey:"parentId",//如果组装的数据不一样的话需要指明自己的idkey和pidkey}},callback: {beforeClick: beforeClick,onCheck: onCheck}};function beforeClick(treeId, treeNode) {columnTree.checkNode(treeNode, !treeNode.checked, null, true);return false;}function onCheck(e, treeId, treeNode) {nodes = columnTree.getCheckedNodes(true),v = "";//栏目显示文字var cid = "";//栏目标识   for (var i=0, l=nodes.length; i<l; i++) {v += nodes[i].name + ",";cid = nodes[i].id;}if (v.length > 0 ) v = v.substring(0, v.length-1);$("#tColumnName").val(v);$("#tColumnName").blur();$("#tagId").val(cid);}function showMenu() {var tColumnIdObj = $("#tColumnName");$("#menuContent").css({left:tColumnIdObj.position().left + "px",top:tColumnIdObj.position().top + tColumnIdObj.outerHeight()+"px"}).slideDown("fast");$("body").bind("mousedown", onBodyDown);}function hideMenu() {$("#menuContent").fadeOut("fast");$("body").unbind("mousedown", onBodyDown);}function onBodyDown(event) {if (!(event.target.id == "menuBtn" || event.target.id == "tColumnName" || event.target.id == "menuContent" || $(event.target).parents("#menuContent").length>0)) {hideMenu();}}$(document).ready(function(){$.ajax({"dataType" : 'json',"type" : "POST","async": false,"url" : "http://test.icms.open.cnlive.com/handler/channeltag/getList.do","success" : function result(res) {columnTree = $.fn.zTree.init($("#treeDemo"), setting,res);               },})});</script>

需要展示树的容器在这里

<tr><td align="right"><label><span style="color:red">*</span>标签：</label></td><td ><input type="hidden" id="tagId" name="tagId" value="${allMainCategorysPath}" /><input input id="tColumnName" name="tColumnName" type="text" readonly onclick="showMenu();" /><div id="menuContent" style=" display: none; position: absolute; background-color: #f5f5f5; border: 1px solid Silver; z-index: 100001; overflow-y: auto; overflow-x:hidden;"><ul id="treeDemo" class="ztree" style="width:230px; overflow:auto;"></ul></div></td></tr>

simpleData: {
                       enable: true,
                       idKey: "id",//如果组装的数据跟树的数据结构一样则不用写idkey和pidkey
                       pIdKey:"parentId",//如果组装的数据不一样的话需要指明自己的idkey和pidkey

}

如何回显？？？

//回显选中的树节点===========================================================//var zTreeObj = $.fn.zTree.getZTreeObj("columnTree");//var nodes = zTreeObj.getCheckedNodes(false);nodes = columnTree.getCheckedNodes(false),tagId= "${tagId}"; for (var i = 0; i < nodes.length; i++) {if (tagId.indexOf(nodes[i].id) != -1) {columnTree.expandNode(nodes[i], true); //展开选中的columnTree.checkNode(nodes[i], true);                   }}onCheck();
//回显选中的树节点结束===========================================================

至于引入什么js文件网上一大堆，自己稍微搜一搜就能搜出来。。。附带一份官方文档。

http://www.treejs.cn/v3/api.php

ztree 树怎么写简单树关键代码相关推荐

原生安卓开发app的框架frida常用关键代码定位
点击上方"Python爬虫与数据挖掘",进行关注回复"书籍"即可获赠Python从入门到进阶共10本电子书今日鸡汤多情却似总无情,唯觉樽前笑不成. ...
超级详细树讲解三 —— B树、B+树图解+代码
首先很高兴你看到了这篇文章,这篇文章可能会花费你很长很长的时间去看,但是这篇文章包括的内容绝对足够你对树的一个系统性的学习.为什么要写这篇文字呢?因为自己在学习树的时候,有些博客只有图解,有些博客只有 ...
oracle 生成目录树,jQuery zTree插件快速实现目录树
ztree是JQuery的一个开源树形目录的插件,用来快速构建网站的树形目录结构,并且提供了功能丰富,利于扩展的API. JQuery ztree官网只要引入jquery和ztree的库js,然后给 ...
CF56E Domino Principle 树状数组 + 简单dp
一个比较简单的题,但是我还是没做出来(哭. 很容易想到从后往前做,所以我们可以维护一个dp数组f,f(i)表示到第i个牌倒下能达到的最远距离. f直接倒着跑,每次取[x,x+h−1][x,x+h-1] ...
算法设计——用分治法查找数组元素的最大值和最小值、用分治法实现合并排序、最小费用问题、树的最大连通分支问题（代码实现）
代码链接:pan.baidu.com/s/15inIth8Vl89R1CgQ_wYc2g 提取码:gf13 算法分析与设计第 1 次实验时间 2020.3.31 地点软件大楼 127 实验名称 ...
浅析B树、B+树插入删除操作（附代码实现）
首先自平衡树是为了解决二叉搜索树在有序数据中退化为链表的问题(即查找时间退化为 O(n) 级别). 自平衡树中,B树.B+树可以说是最简单的,没有旋转.变色等操作.我们可以拿多路平衡查找树和同样是自平 ...
【前缀树】写一个敏感词过滤器
1.什么是敏感词过滤这其实是一个很常见的功能,随处可见以至于你可能都没关注过,基本上在有评论的地方都会有它的身影. 举例来说,你打游戏和别人对喷的时候,是不是一些脏话发不出去哈哈,这些词汇会用*** ...
从零开始写设备树DTS
7.从零开始写设备树设备树就是有一些属性和节点组成的一种数据结构,属性一般会赋予一些属性值,而节点则可能是是由属性跟其下的子节点构成.下面是一个简单的例子: /dts-v1/; / { node1 ...
表格树形结构 HTML CSS,基于jQuery ztree实现表格风格的树状结构
zTree 简介 zTree 是一个依靠 jQuery 实现的多功能 "树插件".优异的性能.灵活的配置.多种功能的组合是 zTree 最大优点. zTree 是开源免费的软件(M ...

ztree 树怎么写简单树关键代码

ztree 树怎么写简单树关键代码相关推荐

最新文章

热门文章

ztree 树怎么写 简单树 关键代码

ztree 树怎么写 简单树 关键代码相关推荐

最新文章

热门文章

ztree 树怎么写简单树关键代码

ztree 树怎么写简单树关键代码相关推荐