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;
}