當前系統使用Extjs做為前端框架，系統首頁布局采用border方式，左邊手風琴式的菜單欄，中間區域為TabPanel容器，點擊左邊菜單欄內的對應菜單在中間區域添加對應的Panel，Panel嵌入添加的gridview；
當前問題是，想在用戶關閉時彈出對話框提示用戶，根據用戶選擇是否銷毀當前頁面(Panel)，或是隱藏當前Panel，保存臨時數據；
查看Extjs API文檔，對添加的panel監聽beforeclose事件
主要代碼如下
中間區域部分：
//centerPanel
centerPanel = new Ext.TabPanel({
id: 'centerPnl'
, region: 'center'
, border: false
, iconCls: 'tabs'
, enableTabScroll: true
, items: [{
title: '首頁'
, autoScroll: true
}]
, defaults: { autoScroll: true }
});增加一個新的Panelfunction addCMUAMS_LogTab() {
activeCMUAMS_LogTab = centerPanel.add({
id: 'CMUAMS_LogShowAll'
, title: '系統日志'
, iconCls: 'tabs'
, closable: true
, bodyStyle: 'padding:10px'
, items: CMUAMS_LogGrid
, listeners: { beforeclose:TabCloseConfirm }
})
activeCMUAMS_LogTab.show();
}
但是這樣的話，情況如下：
Panel在'beforeclose'前已經關閉了；后來上網Google，查閱資料，忽然想到TabePanel作為容器是不是要在其處先進行事件攔截？于是修改中間區域部分代碼如下//centerPanel
centerPanel = new Ext.TabPanel({
id: 'centerPnl'
, region: 'center'
, border: false
, iconCls: 'tabs'
, enableTabScroll: true
, items: [{
title: '首頁'
, autoScroll: true
}]
, defaults: { autoScroll: true }
//首先監聽beforeremove事件
, listeners: { beforeremove: function(ct,component ) { return false; } }
});
再運行，查看效果：
搞定想必點擊Panel上的關閉按鈕時，應該是首先執行的所在TabPanel容器的Remove事件，然后再執行Panel自身的Close事件；項目趕時間，沒過多時間深究了，小弟也是對JS和Extjs了解不深，有路過熟知的朋友望告知真實原因。
