javascript
ExtJS中给Tree节点加click事件
第一種:
?????? 直接通過TreePanel中的Config Option中的listener來添加,代碼如下:
??? var TreePan = new Ext.tree.TreePanel({
??????? id: 'TreePan',
??????? title: "側(cè)邊欄",
??????? 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: "現(xiàn)用技術(shù)標(biāo)準(zhǔn)",
??????????????????????? html: "<iframe src=/"Manage/VolunteerShipInfo.aspx/" marginheight=/"0/" marginwidth=/"0/" width=/"727/" height=/"500/"></iframe>"
??????????????????? });
??????????????????? newWin.show();
??????????????? }
??????????? }?? ????
?}
?
失敗,表現(xiàn)為程序?qū)?“node.isLeaf()”這個(gè)方法的識別有問題,加上這條if語句,則點(diǎn)擊所有節(jié)點(diǎn)沒反應(yīng)(包括非葉節(jié)點(diǎn));去掉這個(gè)if,則點(diǎn)所有節(jié)點(diǎn)都會(huì)出現(xiàn)新窗口(包括非葉節(jié)點(diǎn))。
?
???? 第二種:
???? 使用TreePan.on來添加Event,代碼如下:
?
??? var TreePan = new Ext.tree.TreePanel({
??????? id: 'TreePan',
??????? title: "側(cè)邊欄",
??????? 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: "現(xiàn)用技術(shù)標(biāo)準(zhǔn)",
??????????????? html: "<iframe src=/"Manage/VolunteerShipInfo.aspx/" marginheight=/"0/" marginwidth=/"0/" width=/"727/" height=/"500/"></iframe>"
??????????? });
??????????? newWin.show();
??????? }
??? }
?
失敗,表現(xiàn)如方法二。
?
???? 第三種:
???? 通過查API Document,知道可以用addListener這個(gè)方法來給TreePanel添加Event,于是嘗試如下:
?
??? var TreePan = new Ext.tree.TreePanel({
??????? id: 'TreePan',
??????? title: "側(cè)邊欄",
??????? 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: "現(xiàn)用技術(shù)標(biāo)準(zhǔn)",
??????????????? html: "<iframe src=/"Manage/VolunteerShipInfo.aspx/" marginheight=/"0/" marginwidth=/"0/" width=/"727/" height=/"500/"></iframe>"
??????????? });
??????????? newWin.show();
?? ?????}
??? }
?
成功,終于可以實(shí)現(xiàn)只有在點(diǎn)擊葉節(jié)點(diǎn)時(shí)才彈出浮窗了。
?轉(zhuǎn)自:http://blog.csdn.net/scythev/article/details/4818610
?
轉(zhuǎn)載于:https://www.cnblogs.com/xuhongfei/p/4037060.html
總結(jié)
以上是生活随笔為你收集整理的ExtJS中给Tree节点加click事件的全部內(nèi)容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: WPF使用RoutedCommand自定
- 下一篇: STL之set和multiset(集合)