日期:2014-05-16  浏览次数:20358 次

ExtJs实现树状菜单
 tree = new Ext.tree.TreePanel({
         renderTo: 'my-left-menu',   //树放在div的位置
         autoScroll:false,  //是否使用自动出现滚动条
         useArrows: true,  //是否使用箭头样式
         loader:new Ext.tree.TreeLoader({dataUrl:'myMenu.action'}),
          //加载的数据,返回的是json串
         root: {
             nodeType: 'async',
             text: '我的应用',
             id: 'root'
         },
         listeners: {
        	  click : function (node, e) {
                  if (node.isLeaf()) { //如果是叶子节点则触发事件
                	  jQuery('#myIframe').attr('src',node.url);
                 } 
        	  }
         }
     });
     tree.expandAll();	 //展开所有树节点

?

?? 如果要修改ext中树的样式,比如换图标,可以复写css样式,这样ext树会查找新写入的样式

?

?????? /*更换叶子节点图标*/
.x-tree-node-leaf .x-tree-node-icon {
????? background: url("../images/menu/icon_product2.png") no-repeat scroll center center transparent;
}