wdTree 轻量级的 jQuery 目录树插件
wdTree 是一个轻量级的 jQuery 目录树插件,支持多级目录选择,目录和文件复选框选项,获取复选框的值,支持多个配置参数自定义,多个回调函数配置,还可以从其他页面 AJAX Loading 数据加载。
使用方法
要使用这个插件,需要一个 HTML 的元素,比如下面的代码:
<div id="tree"></div>
然后调用插件
var o = { showcheck: true //onnodeclick:function(item){alert(item.text);}, }; o.data = treedata; $("#tree").treeview(o);
获取Checkbox选择中的元素
$("#showchecked").click(function(e){ var s=$("#tree").getCheckedNodes(); if(s !=null) alert(s.join(",")); else alert("NULL"); });
获取当前选中的元素
$("#showcurrent").click(function(e){ var s=$("#tree").getCurrentNode(); if(s !=null) alert(s.text); else alert("Current node is nothing"); });
配置参数
data配置支持一下的配置参数
data:[{ id:"node1", //node id text:"node 1", //node text for display. value:"1", //node value showcheck:false, //whether to show checkbox checkstate:0, //Checkbox checking state. 0 for unchecked, 1 for partial checked, 2 for checked. hasChildren:true, //If hasChildren and complete set to true, and ChildNodes is empty, tree will request server to get sub node. isexpand:false, //Expand or collapse. complete:false, //See hasChildren. ChildNodes:[] // child nodes }]
其他可用的配置参数
- cascadecheck:Boolean Whether node being seleted leads to parent/sub node being selected.
- cbiconpath:String Checkbox image path.
- clicktoggle:String Whether to toggle node when node clicked.
- showcheck:Boolean Whether to show check box or not.
- theme:String Tree theme. Three themes provided. 'bbit-tree-lines' ,'bbit-tree-no-lines' and 'bbit-tree-arrows'.
- url:String Url for child nodes retrieving.
回调函数
oncheckboxclick( tree, item, status)
Fired when check box is clicked on.
Object | tree | This tree object. |
Object | item | Node item clicked on. |
Number | status | 1 for checked, 0 for unchecked. |
onnodeclick( tree, item)
Fired when a node is clicked on.
Object | tree | This tree object. |
Object | item | Ndde item clicked on. |
本地下载地址:wdTree
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论