easyui版本 1.5.5.4
html代码:
<div data-options="region:'center'" style="padding:5px;">
<div id="tt" class="easyui-tabs" style="width:100%;height:600px;">
</div>
</div>
<div id="mm" style="width:120px;display:none;">
<div>刷新</div>
<div class="menu-sep"></div>
<div>关闭其他选项卡</div>
<div>关闭左侧选项卡</div>
<div>关闭右侧选项卡</div>
</div>
JS代码:
$.extend($.fn.tabs.defaults,{
onAdd:function(t,i){
var thisID = $(this).attr('id');
var tabOp = $(this).tabs('options');
$('#'+thisID+'>.tabs-header>.tabs-wrap>ul>li').unbind("contextmenu");
$('#'+thisID+'>.tabs-header>.tabs-wrap>ul>li').contextmenu(function(e){
var tabIndex = $(e.target).parentsUntil('ul').prevAll().length;
if(e.button == 2){
$('#mm').menu({
onClick:function(item){
switch (item.text) {
case '刷新':
tabOp.refreshTab(thisID,tabIndex);
break;
case '关闭其他选项卡':
tabOp.closeOtherTab(thisID,tabIndex);
break;
case '关闭左侧选项卡':
tabOp.closeLeftTab(thisID,tabIndex);
break;
case '关闭右侧选项卡':
tabOp.closeRightTab(thisID,tabIndex);
break;
}
}
});
$('#mm').menu('show',{
left:e.pageX,
top:e.pageY
});
}
return false;
});
},
refreshTab:function(id,tIndex){
var tab = $('#'+id).tabs('getTab',tIndex);
tab.panel('refresh');
},
closeLeftTab:function(id,tIndex){
var num = tIndex;
for(var $i=0;$i<num;$i++){
$('#'+id).tabs('close',0);
}
},
closeRightTab:function(id,tIndex){
var total = $('#'+id).tabs('tabs').length;
var num = total-(tIndex+1);
for(var $i=0;$i<num;$i++){
$('#'+id).tabs('close',tIndex+1);
}
},
closeOtherTab:function(id,tIndex){
this.closeRightTab(id,tIndex);
this.closeLeftTab(id,tIndex);
}
});