最近整理了一下树,使用jquery插件的方式重写。感觉比以前仅仅基于jquery写看的舒服多了。和以前一样还是借用treeview 的样式。
目前实现的功能和准备移植能的功能:
- 树的按层初始化(通过expanded属性可以控制节点的默认展开)
- 根节点的可控显示(通过初始化参数 isShowRoot控制)
- 支持单独为每一个节点设置展开、关闭和图标文件(属性fileIcon、folderIcon、openFolderIcon)
- 支持复选框(youiChecked属性控制)
- 树的点击动作(通过youiAction属性关联注册动作,事件 默认为click ,通过actionHandle属性控制,可以为dblclick)
- 动态读取(src属性,未完成,还在考虑那种方式比较好,只实现了简单的id和text的读取。)
- 拖放(属性draggable控制 依赖jquery 的ui组件 draggable,简单的实现,未完善)
- 树的搜索根据路径查找节点(支持未读取数据方式的查找展开,以前实现的速度比较慢,改动比较大,还在想用什么方法比较好)
action注册:
html 代码
- <li youiAction="showStatusBar" youiChecked="true" id="2703000000004"><a><span>2703000000004失业率(月度数据)span>a>li>
js 代码
- jQuery.actionFactory.register("showStatusBar",function(checked){
- alert(this.options.text);
- if(checked=="true"){
- alert("显示状态栏");
- }else{
- alert("隐藏状态栏");
- }
- });
2703000000004失业率(月度数据)
增加功能:
动态读取(xml数据集格式)
xml数据附加其他属性到树节点
节点定位openPath
js 代码
- $("#demoTree").load("template.html",function(){
- var templateTree = $(this).youiTree({
- treeMapObject:{
- mapId :'fileId',
- mapText :'fileName',
- mapPid :'parentFileId'
- },
- attributes:'filePath'
- });
- templateTree.openPath("t1/t11/t21");
- $(this).show();
- });
- 大小: 52.5 KB
分享到:
相关推荐
这是一个jquery的树形组件,用于web应用开发,绝对经典!
在工作中的项目使用的是一个前端基于 jQuery easyui 的一个系统,其中左侧的主菜单使用的是 easyui 中的 tree 组件,不是太熟悉,不过感觉不是太好用。 比如 easyui 中的 tree 需要单击分叉节点前的小三角,才能够...
jquery-treegrid 树形表格组件 最新的treegrid 版本 下载
jquery超漂亮树形控件
基于c#、jquery开发的treeView目录树组件,最大的特点是可以将树节点的显示状态以ajax方式,保存到用户session里,即使页面刷新,树的显示状态也不会丢失,效率极佳。 扩展性也非常好,组件的html和css分离,很简洁...
treeTable是跨浏览器、性能很高的jquery的树表组件,它使用非常简单,只需要引用jquery库和一个js文件,接口也很简单。 优点 ◦兼容主流浏览器: 支持IE6和IE6+, Firefox, chrome, Opera, Safari ◦接口简洁: 在普通...
Jquery TreeView 树形插件 美观方便使用的第三方插件
jquery插件,展示服务器的目录树结构哦
带搜索功能的jQuery树形菜单,即下即用,效果不错,代码容易理解
highchecktree是一款使用指定源数据生成带复选框的树形结构的jQuery插件。该树形结构插件对于在大数据的处理上性能十分出色。它使用懒加载的形式来提供性能,子节点会在点击时才去加载数据。
juery编写树,标签等常用漂亮组件打包下载,很好用的资料
1.菜单 2.弹出层插件 3.弹出日历组件 4.放大镜效果 5.联级菜单组件 6.树 7.图片预览
根据数据库自动生成带CheckBox,选中并选中父节点
一款根据json字符串格式加载出一个树结构,通过设置可对树结构进行表格化的jQuery树结构菜单树形选择器代码。