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