Jquery EasyUI tabs处理
一 获取选中的 Tab
1. // 获取选中的 tab panel 和它的 tab 对象
2. var pp = $('#tt').tabs('getSelected');
3. var tab = pp.panel('options').tab; // 相应的 tab 对象
注:根据指定tab的title 获取tab对象接口使用方式如下:
var tab = $('#tt').tabs('getTab','title'),
二 更新特定的选项卡面板 可使用update方法,param参数包含2个属性:
tab: 将被更新的选项卡。
options: 选项卡相关配置项。
//当前被选中的tab
var current_tab = $('#frame_tabs').tabs('getSelected');
$('#frame_tabs').tabs('update',{
tab:current_tab,
options : {
content : '<iframe scrolling="auto" frameborder="0" src="'+URL+'" style="width:100%;height:100%;"></iframe>',
//或者 href : '';
}
});
1.创建tab,同时捕捉 'onSelect' 事件
$('#tt').tabs({
border:false,
onSelect:function(title){
alert(title+' is selected');
}
});
2.增加新的tab panel
$('#tt').tabs('add',{
title:'New Tab',
content:'Tab Body',
closable:true
});
三 tabs 动态加载iframe
$('#EasyTabs').tabs('add', {
title: tabTitle,
content: '<iframe frameborder="0" src="' + ContentUrl + '" style="width:100%;height:100%;"></iframe>',
iconCls: 'icon-tip',
closable: true,
tools: [{
iconCls: 'icon-mini-refresh',
handler: function () {
alert('refresh');
}
}]
});
EasyUI相同的Tab只打开一个(即EasyUI方法的调用方法)
function addTabA(title){
if ($('#tt').tabs('exists', title)){
$('#tt').tabs('select', title);
} else {
$('#tt').tabs('add',{
title:title,
content:'Tab Body ' ,
iconCls:'icon-save',
closable:true
});
}
}
jQuery EasyUI的其他方法调用方式相似
例如:layout 默认收起
$('#layout').layout('collapse', 'north');
浙公网安备 33010602011771号