快捷導(dǎo)航

extjs tabpanel限制選項(xiàng)卡數(shù)量實(shí)現(xiàn)思路及代碼

更新時(shí)間：2013年04月02日 14:57:23 作者：

使用的是用變量存儲(chǔ) id 加載新的選卡時(shí) 交換 id ，從而限制了打開(kāi)的選項(xiàng)卡數(shù)量，如果不是一定要這個(gè)效果，建議不要頻繁的關(guān)閉和創(chuàng)建tabpanel，感興趣的朋友可以參考下哈

復(fù)制代碼代碼如下:

 
var tabIndex = 'shouye'; 
var tabIndex2 = 'shouye'; 
var tabIndex3 = 'shouye'; 
var tabIndex4 = 'shouye'; 
var tabIndex5 = 'shouye'; 
var tabIndex6 = 'shouye'; 
var tabIndex7 = 'shouye'; 
/** 
* 向TabPanel組件中添加窗口或激活已經(jīng)存在的窗口 
* 并將指定資源加載進(jìn)窗口 
* @param node : 傳入的Node節(jié)點(diǎn) 
*/ 
var loadPanel = function(node) { 
var id= node.id;//獲取節(jié)點(diǎn)的id 
tabIndex7 = id; 
var href = node.attributes.href;//獲取節(jié)點(diǎn)中的href屬性 
var text = node.text; 
var mainPanel = Ext.getCmp('mainPanel'); 
//mainPanel.remove('mainPanel', true); 
var qtip = node.attributes.qtip; 
var tab = mainPanel.getComponent(String(id));//獲取指定id的組件對(duì)象 
if(tab) { 
mainPanel.setActiveTab(tab);//檢驗(yàn)當(dāng)前Tab選項(xiàng)卡是否存在，如果存在只需要激活 
return; 
} 
//如果選項(xiàng)卡不存在，則以下為創(chuàng)建選項(xiàng)卡代碼 
tab = mainPanel.add(new Ext.Panel ({ 
//創(chuàng)建新選項(xiàng)卡的配置 
id : String(id),//設(shè)置ID,需強(qiáng)制轉(zhuǎn)換為string類型 
title : text,//設(shè)置選項(xiàng)卡標(biāo)題 
tabTip : text, 
html : '<iframe width=100% id=main_desk name=main_desk height=100% frameborder=0 scrolling=auto src=' + href + ' />', 
autoScroll: true, 
enableTabScroll:true, 
defaults: {autoScroll:true}, 
closable : true //是否可以關(guān)閉 
})); 
mainPanel.setActiveTab(tab);//創(chuàng)建選項(xiàng)卡后，將其激活 
mainPanel.remove(tabIndex, true); 
tabIndex = tabIndex2; 
tabIndex2 = tabIndex3; 
tabIndex3 = tabIndex4; 
tabIndex4 = tabIndex5; 
tabIndex5 = tabIndex6; 
tabIndex6 = tabIndex7; 
} 