JS 树形控件 MzTreeView

未知
JavaScript
跨平台
2011-07-26
红薯

MzTreeView 1.0 是数据一次性加载,客户端节点异步展示的WEB脚本树。MzTreeView 1.0 的理论节点数设计上限为十万节点,在节点数三万的情况下页面打开时间小于 3 秒。无限层次无限节点的数的层级组成方式:id parentId。即每个节点除本身的节点id之外还有它的父层节点id,通过这种方式就可以组合成无限层级的树了。

在 MzTreeView 里都有一个虚的根节点,其ID为0,用户可见的根节点其父节点ID皆为0

 

 

属性

MzTreeView 类的一些属性:

 

属性名
类型
属性的具体说明

MzTreeView.nodes
集合
服务器端给树指定数据源时数据存放的对象,具体存放格式如:
MzTreeViewHandle.nodes["parentId_nodeId"] = "text: nodeText; icon: nodeIcon; url: nodeURL; ...";

MzTreeView.url
地址字符串
可读写,树缺省的URL,默认值是 #

MzTreeView.target
目标框架名
可读写,树缺省的链接target,默认值是 _self

MzTreeView.name
字符
只读,树的实例名,同树实例化时作为参数传入(大小写敏感):
var Tree = new MzTreeView("Tree");

MzTreeView.currentNode
树节点
只读,树当前得到焦点的节点对象

MzTreeView.icons
集合
树所使用的所有图标存放

MzTreeView.iconsExpand
集合
树里展开状态的图标存放

MzTreeView.colors
集合
树里使用到的几个颜色存放


MzTreeView 在客户端的节点所拥有的属性:

属性名
属性的具体说明

node.id
数字文本,节点的ID

node.parentId
数字文本,节点对应的父节点ID

node.text
文本,节点的显示文本

node.hint
文本,节点的注释说明

node.icon
文本,节点对应的图标

node.path
文本,节点在树里的绝对路径:0_1_10_34

node.url
文本,该节点的 URL

node.target
文本,该节点链接的目标框架名

node.data
文本,该节点所挂载的数据

node.method
文本,该节点的点击对应处理语句

node.parentNode
对象,节点的父节点对象

node.childNodes
数组,包含节点下所有子节点的数组

node.sourceIndex
文本,服务器给予的数据里对象的 parentId_nodeId 的组合字符串

node.hasChild
布尔值,指该节点是否有子节点

node.isLoad
布尔值,本节点的子节点数据是否已经在客户端初始化

node.isExpand
布尔值,节点的展开状态

方法

MzTreeView 类的一些方法:

方法名
方法的具体说明

MzTreeView.toString()
类的默认初始运行

MzTreeView.buildNode(id)
将该节点的所有下级子节点转换成 HTML 并在网页上体现出来

MzTreeView.nodeToHTML(node, AtEnd)
将 node 转换成 HTML

MzTreeView.load(id)
从数据源里加载当前节点下的所有子节点

MzTreeView.nodeInit(sourceIndex, parentId)
节点的信息初始,从数据源到客户端完整节点的转化

MzTreeView.focus(id)
聚集到某个节点上

MzTreeView.expand(id[, sureExpand])
展开节点(包含下级子节点数据的加载初始化)

MzTreeView.setIconPath(path)
给节点图片设置正确的路径

MzTreeView.nodeClick(id)
节点链接点击时同时被触发的点击事件处理方法

MzTreeView.upperNode()
跳转到当前聚集节点的父级节点

MzTreeView.lowerNode()
跳转到当前聚集节点的子级节点

MzTreeView.pervNode()
跳转到当前聚集节点的上一节点

MzTreeView.nextNode()
跳转到当前聚集节点的下一节点

MzTreeView.expandAll()
展开所有的树点,在总节点量大于500时这步操作将会比较耗时

加载中

评论(1)

情天大圣
情天大圣
MzTreeView 有点吹牛B啊,30000节点少于3s,胡说!

暂无资讯

9
回答
js-css:如何通过 getElementsByClassName(这个参数应该传什么) 取得所有的 <a class=MzTreeview>里的内容的字体大小

背景需求是 mztreeview的字体有点小,想增加手工选择 大中小 的功能: https://haitao.appinn.me/config/mytre...

2018/03/04 02:39
1
回答
MzTreeView

在一个单纯的html显示时,节点层级都正常的缩进了。但是放到系统里面运行,子节点不缩进。

2013/06/14 09:56
4
回答
MzTreeView checked问题

var IDs = "" ; var nodes = tree.nodes; for (var i in nodes) { if (nodes[i]. c...

2011/07/26 15:24

没有更多内容

加载失败,请刷新页面

没有更多内容

java树控件之dtree,rtree,梅花雪树

java中有些东西是时常会用到但是要是从头开始原生的写的话,就会花掉很多时间,就比如这里的树。在开发中,树控件很常用也很容易发生一些错误。我们假使使用js的树的话,除了关注里面的构成细...

2014/04/15 13:44
57
0

没有更多内容

加载失败,请刷新页面

没有更多内容

返回顶部
顶部