Tree( 树) 组件[3]
本节课重点了解 EasyUI 中 Tree(树)组件的使用方法, 这个组件依赖于 Draggable(拖
动)和 Droppable(放置)组件。
一. 事件列表
很多事件的回调函数都包含'node'参数,其具备如下属性:
id:绑定节点的标识值。
text:显示的节点文本。
iconCls:显示的节点图标 CSS 类 ID。
checked:该节点是否被选中。
state:节点状态,'open' 或 'closed'。
attributes:绑定该节点的自定义属性。
target:目标 DOM 对象。
//部分事件
$('#box').tree({
url : 'tree.php',
lines : true,
checkbox : true,
onlyLeafCheck : true,
dnd : true,
onClick : function (node) {
console.log(node);
},
onDblClick : function (node) {
console.log(node);
},
onBeforeLoad : function (node, param) {
console.log(node);
console.log(param);
//return false;
},
onBeforeLoad : function (node,param) {
console.log(node);
console.log(param);
},
onLoadError : function (arguments) {
console.log(arguments);
},
onBeforeExpand : function (node) {
console.log(node);
},
onExpand : function (node) {
console.log(node);
},
onBeforeCollapse : function (node) {
console.log(node);
},
onCollapse : function (node) {
console.log(node);
},
onBeforeCheck : function (node) {
console.log(node);
},
onCheck : function (node, checked) {
console.log(node);
console.log(checked);
},
onBeforeSelect : function (node) {
console.log(node);
},
onContextMenu: function(e, node){
e.preventDefault();
// 查找节点
$('#box').tree('select', node.target);
// 显示快捷菜单
$('#menu').menu('show', {
left: e.pageX,
top: e.pageY
});
}
onBeforeDrag : function (node) {
console.log(node);
},
onDragEnter : function (target, source) {
console.log(target);
console.log(source);
},
onBeforeDrop : function (target, source, point) {
console.log(target);
console.log(source);
console.log(point);
},
});
最新文章
- SalesForce 记录级别安全性
- [BZOJ2768][JLOI2010]冠军调查(最小割)
- JavaScript中Eval()函数的使用
- 使用AngularJS构建大型Web应用
- linq里面似in的查询
- source和.命令的区别
- HDU 4280 Island Transport(网络流)
- [转]CodeIgniter与Zend Acl结合实现轻量级权限控制
- sql取整函数
- 一个用 js 实现点阵图的编辑器演示
- 用scheme最基本的元素定义排序函数
- java06作业归档
- [OC] Delegate的使用
- linux 禁止22端口号
- shell数组应用
- iOS Ad hoc
- 2014年10月Android面试总结
- [转]WebForm中使用MVC
- Git 学习(八)其他
- Markdown语法简编