<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; } }
相关推荐
Easyui添加Tab右键菜单示例,右键弹出操作菜单,刷新、关闭、全部关闭、关闭左侧、关闭右侧
前期的准备工作: 1、下载DEMO源码,并升级为最新版本(jquery 1.7.2,Easyui 1.2.6),直接替换就可以啦,升级easyui 是的要把css js theme 全部替换 2、在首页的HTML代码中:将 代码如下: ”mm” class=”easyui-...
下面小编就为大家带来一篇为jQuery-easyui的tab组件添加右键菜单功能的简单实例。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
添加了一个鼠标右键菜单进入,让操作更加鲜明。能满足多种情况
NULL 博文链接:https://xiaofengtoo.iteye.com/blog/1263362
EasyUI datagrid+tree右键+window弹出层综合运用
为了操作方便,添加了一个右键菜单进入,也适当的添加了动画,让操作变得圆滑。
用户在每次使用的时候,都需要去先选中一条或者多条数据,然后在去点按钮进行相关操作,这样其实还是很麻烦的,做项目的过程中,为了用户着想,做了一个右键菜单,用户想要删除或者编辑某一条数据直接在其位置上右键...
Jquery easyui tabs bar 添加右键菜单,防浏览器tab提供关闭当前,关闭其他,关闭左侧右侧等功能。
用jQuery实现了三种情况下的变灰不可用的效果,当鼠标放到上面点击,右键菜单就会消失,其实解决的办法也很简单,只要在对应的单击事件里重新绑定右键菜单即可,需要的朋友可以参考下
原生态jsmind没有右键菜单功能,为了操作方便,添加了一个右键菜单进入,同时可实现拖拽操作。
easyui选项卡模仿浏览器的右键关闭功能。 easyui选项卡模仿浏览器的右键关闭功能。
easyui tab 绝对好用的tab插件
非常好看的易用的easyui tabs 右键插件,自己两行代码就搞定
easyui右键设置疑问
下面小编就为大家带来一篇jQuery EasyUI 右键菜单--关闭标签/选项卡的简单实例。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
jQuery EasyUI 实例演示(菜单、TAB等)! 值得下载看看!资源免费,大家分享!! 更多免费资源 http://ynsky.download.csdn.net/
主要介绍了jQuery EasyUI右键菜单实现关闭标签/选项卡,具有一定的参考价值,感兴趣的小伙伴们可以参考一下