EasyUIのタブに右クリックメニューを追加
2876 ワード
<div id="mm" class="easyui-menu" style="width:150px;">
<div id="mm-tabclose" name="1"> </div>
<div id="mm-tabcloseall" name="2"> </div>
<div id="mm-tabcloseother" name="3"> </div>
<div class="menu-sep"></div>
<div id="mm-tabcloseright" name="4"> </div>
<div id="mm-tabcloseleft" name="5"> </div>
</div>
// ,
$('#tt').tabs({
onContextMenu : function(e, title, index) {
e.preventDefault();
//if (index > 0) {
$('#mm').menu('show', {
left : e.pageX,
top : e.pageY
}).data("tabTitle", title);
//}
}
});
// click
$("#mm").menu({
onClick : function(item) {
closeTab(this, item.name);
}
});
// Tabs
function closeTab(menu, type) {
var obj = $('#tt');
;
var allTabs = obj.tabs('tabs');
var allTabtitle = [];
$.each(allTabs, function(i, n) {
var opt = $(n).panel('options');
if (opt.closable) {
allTabtitle.push(opt.title);
}
});
var curTabTitle = $(menu).data('tabTitle');
// console.log('curTabTitle:' + curTabTitle)
var curTabIndex = obj.tabs('getTabIndex', obj.tabs('getTab', curTabTitle));
/**
* <pre>
* 1:
* 2:
* 3:
* 4:
* 5:
* </pre>
*/
switch (type) {
case '1':
obj.tabs('close', curTabTitle);
break;
case '2':
for (var i = 0, j = allTabtitle.length; i < j; i++) {
obj.tabs('close', allTabtitle[i]);
}
break;
case '3':
for (var i = 0, j = allTabtitle.length; i < j; i++) {
if (curTabTitle != allTabtitle[i]) {
obj.tabs('close', allTabtitle[i]);
}
}
obj.tabs('select', curTabTitle);
break;
case '4':
for (var i = curTabIndex + 1 ,j = allTabtitle.length; i<j; i++) {
obj.tabs('close', allTabtitle[i]);
}
obj.tabs('select', curTabTitle);
break;
case '5':
for (var i = 0; i < curTabIndex; i++) {
obj.tabs('close', allTabtitle[i]);
}
obj.tabs('select', curTabTitle);
break;
}
}