tree基本功能介绍

来源:互联网 发布:js获取form表单参数 编辑:程序博客网 时间:2024/05/21 21:34
1、初始化一棵树
                var tree = new Ext.tree.TreePanel({
                    el: 'tree'
                });


                var root = new Ext.tree.TreeNode({ text: '我是根' });
                var node1 = new Ext.tree.TreeNode({ text: '我是根的第一个枝子' });
                var node2 = new Ext.tree.TreeNode({ text: '我是根的第一个枝子的第一个叶子' });
                var node3 = new Ext.tree.TreeNode({ text: '我是根的第一个叶子' });
                node1.appendChild(node2);
                root.appendChild(node1);
                root.appendChild(node3);


                tree.setRootNode(root);
                tree.render();


                root.expand(true, true);


2、树的事件:
    tree.on("expandnode", function(node){
        Ext.log(node + "展开了");
    });
    tree.on("collapsenode", function(node){
        Ext.log(node + "折叠了");
    });
    tree.on("click", function(node){
        Ext.log("你单击了" + node);
    });
    tree.on("dblclick", function(node){
        Ext.log("你双击了" + node);
    });


3、树中添加右键菜单
    var contextmenu = new Ext.menu.Menu({
        id: 'theContextMenu',
        items: [{
            text: '有本事点我哦!',
            handler: function(){
                alert('我被击中了,啊。。。');
            }
        }]
    });
    tree.on("contextmenu", function(node, e){
        e.preventDefault();
        node.select();
        contextmenu.showAt(e.getXY());
    });


4、
原创粉丝点击