ExtJS中给Tree节点加click事件

第一种：

直接通过TreePanel中的Config Option中的listener来添加，代码如下：

var TreePan = new Ext.tree.TreePanel({

id: 'TreePan',

title: "侧边栏",

useArrows: true,

width: 240,

height: 660,

region: 'west',

frame: true,

autoScroll: true,

enableDD: false,

containerScroll: true,

draggable: false,

root: root,

rootVisible: false,

collapsible: true,

collapsed: true,

animate: true,

listeners: {

'click': function(node, e) {

if (node.isLeaf()) {

var newWin = new Ext.Window({

width: 745,

height: 529,

title: "现用技术标准",

html: "<iframe src=/"Manage/VolunteerShipInfo.aspx/" marginheight=/"0/" marginwidth=/"0/" width=/"727/" height=/"500/"></iframe>"

});

newWin.show();

}

}

}

失败，表现为程序对 “node.isLeaf()”这个方法的识别有问题，加上这条if语句，则点击所有节点没反应（包括非叶节点）；去掉这个if，则点所有节点都会出现新窗口（包括非叶节点）。

第二种：

使用TreePan.on来添加Event，代码如下：

var TreePan = new Ext.tree.TreePanel({

id: 'TreePan',

title: "侧边栏",

useArrows: true,

width: 240,

height: 660,

region: 'west',

frame: true,

autoScroll: true,

enableDD: false,

containerScroll: true,

draggable: false,

root: root,

rootVisible: false,

collapsible: true,

collapsed: true,

animate: true,

}

TreePan.on('click', BiaoZhunClick);

function BiaoZhunClick(node, e) {

if (node.leaf) {

//            e.stopEvent();

var newWin = new Ext.Window({

width: 745,

height: 529,

title: "现用技术标准",

html: "<iframe src=/"Manage/VolunteerShipInfo.aspx/" marginheight=/"0/" marginwidth=/"0/" width=/"727/" height=/"500/"></iframe>"

});

newWin.show();

}

}

失败，表现如方法二。

第三种：

通过查API Document，知道可以用addListener这个方法来给TreePanel添加Event，于是尝试如下：

var TreePan = new Ext.tree.TreePanel({

id: 'TreePan',

title: "侧边栏",

useArrows: true,

width: 240,

height: 660,

region: 'west',

frame: true,

autoScroll: true,

enableDD: false,

containerScroll: true,

draggable: false,

root: root,

rootVisible: false,

collapsible: true,

collapsed: true,

animate: true,

}

TreePan.addListener('click', BiaoZhunClick);

function BiaoZhunClick(node, e) {

if (node.leaf) {

//            e.stopEvent();

var newWin = new Ext.Window({

width: 745,

height: 529,

title: "现用技术标准",

html: "<iframe src=/"Manage/VolunteerShipInfo.aspx/" marginheight=/"0/" marginwidth=/"0/" width=/"727/" height=/"500/"></iframe>"

});

newWin.show();

}

}

成功，终于可以实现只有在点击叶节点时才弹出浮窗了。

转自：http://blog.csdn.net/scythev/article/details/4818610