easyui 动态加载tab

easyui框架动态加载tabs

闲话不多说，直接奔入主题。

jsp页面 需要加一个tab的id:

 

 

js:

function testTabs(){

//3个tabs的路径

urls = [ basePath + 'test1.action',//测试tabs1

           basePath + 'test2.action'//测试tabs2

  basePath + 'test3.action'//测试tabs3

];

$('#texttabs').tabs('add', {
title : '测试tabs1',
content : "",
closable : false
});


$('#texttabs').tabs('add', {
title : '测试tabs2',
content : "",
closable : false


});


$('#texttabs').tabs('add', {
title : '测试tabs3',
content : "",
closable : false

});

$('#texttabs').tabs(
{
border : false,
fit : true,
onSelect : function(title, index) {

var url = urls[index];

if($('#apList'+ index+ '').length == 0){ //如果tabs不为空 ，则不刷新 这个判断根据实际情况考虑是否添加

var content = '';
var activeTab = $('#texttabs').tabs('getTab',index);
$('#texttabs').tabs('update', {
tab : activeTab,
options : {
content : content
}

});

}

}
});


// 默认选择第一个tab
$('#texttabs').tabs('select', 0);

}

这个方法如果多次调用testTabs()方法，会无限增加testTabs()中的3个tabs,所有如何需要多次反复调用，需要在再次调用testTabs()之前删除之前的tabs

js代码如下： for(var i=$('#texttabs').tabs('tabs').length-1;i>=0;i--) {
            $("#texttabs").tabs('close', i);
           }