EasyUI 的Tab 标签添加右键菜单

样式：

主要提供右键功能代码。

(只需要提供你需要的js和css就行了)

<!doctype html>
<html>
<head> <basehref="/smile/" /> <title>标签右键菜单</title> <metahttp-equiv="Content-Type"content="text/html; charset=UTF-8" /><metaHTTP-EQUIV="Pragma"CONTENT="no-cache"> <metaHTTP-EQUIV="Cache-Control"CONTENT="no-cache"> <metaHTTP-EQUIV="Expires"CONTENT="0"> <linkrel="stylesheet"type="text/css"href="/smile/js/easyui/themes/icon.css?ver=1.0031" /> <linkrel="stylesheet"type="text/css"href="/smile/js/easyui/themes/gray/easyui.css?ver=1.0031" />  <scripttype="text/javascript"src="/smile/js/jquery.min.js?ver=1.0031"></script> <scripttype="text/javascript"src="/smile/js/easyui/jquery.easyui.min.js?ver=1.0031"></script> </head>
<bodyclass="easyui-layout"> <divdata-options="region:'west',title:'功能导航菜单',collapsible:false,iconCls:'fa fa-leaf'"style="width: 200px;"> <divid="aa"class="easyui-accordion"data-options="fit:true"><divtitle="菜单一"style="overflow: auto; padding: 5px;"iconCls="fa fa-building"> <ulclass="easyui-tree"data-options="onClick:clickTree"> <lidata-options="attributes:{'url':'/smile/html/menu1.html'}"><span>菜单一</span></li> </ul> </div> <divtitle="菜单二"style="overflow: auto; padding: 5px;"iconCls="fa fa-building"> <ulclass="easyui-tree"data-options="onClick:clickTree"> <lidata-options="attributes:{'url':'/smile/html/menu2.html'}"><span>菜单二</span></li>  </ul> </div></div> </div><!--首页--> <divdata-options="region:'center',collapsible:false"><divid="mainTabs"class="easyui-tabs"data-options="fit:true,narrow:true"><divtitle="首页"style="overflow:hidden;"data-options="iconCls:'fa fa-home'"><divid="myclock"style="margin: 0 auto;width: 400px;"class="clock"></div> </div></div> </div><!--右键菜单栏--><divid="mm"class="easyui-menu"style="width: 120px;">      <divid="mm-tabclosecurrent"name="1"> 关闭当前页</div><divid="mm-tabcloseall"name="2">   全部关闭</div><divid="mm-tabcloseother"name="3">  其他全部关闭</div></div>   <scripttype="text/javascript">$(function(){//监听右键事件，创建右键菜单
$('#mainTabs').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);}});});functionaddTab(title, url) {if($('#mainTabs').tabs('exists', title)) {$('#mainTabs').tabs('select', title);}else{varcontent= '<iframe  scrolling="auto" frameborder="0"  src="'+url+'" style="width:100%;height:99%;"></iframe>';$('#mainTabs').tabs('add', {title: title,          content: content,     closable:true,cache:true,   }); }}////删除TabsfunctioncloseTab(menu, type) {varallTabs=$("#mainTabs").tabs('tabs');varallTabtitle=[];$.each(allTabs,function(i, n) {varopt=$(n).panel('options');if(opt.closable)allTabtitle.push(opt.title);});varcurTabTitle=$(menu).data("tabTitle");varcurTabIndex=$("#mainTabs").tabs("getTabIndex", $("#mainTabs").tabs("getTab", curTabTitle));switch(type) {case "1"://关闭当前
$("#mainTabs").tabs("close", curTabTitle);return false;break;case "2"://全部关闭for(vari= 0; i<allTabtitle.length; i++) {$('#mainTabs').tabs('close', allTabtitle[i]);}break;case "3"://关闭其他全部for(vari= 0; i<allTabtitle.length; i++) {if(curTabTitle!=allTabtitle[i])$('#mainTabs').tabs('close', allTabtitle[i]);}$('#mainTabs').tabs('select', curTabTitle);break;}}functionclickTree(node) {if($(this).tree('isLeaf', node.target)) {addTab(node.text, node.attributes.url); }else{$(this).tree('toggle', node.target);}}</script>
</body>
</html>

EasyUI 的Tab 标签添加右键菜单相关推荐

为EasyUI 的Tab 标签添加右键菜单
近期研究了下MenuButton,有了新的感悟,原先在那个DEMO中右键支持做法,现在看来真是小儿科啊! 前期的准备工作: 1.下载DEMO源码,并升级为最新版本(jquery 1.7.2,Easyu ...
tkinter向文本框里加内容_给tkinter文本框添加右键菜单
给tkinter文本框添加右键菜单需求:直接右键点击使用tkinter创建的文本框是不会弹出菜单的.我们需要实现右键点击tkinter框架下的Entry对象.Text对象后弹出右键菜单可复制.粘贴和 ...
chrome添加右键菜单收藏CSDN文章到我的博客
需求: 看到好的文章时,想收藏,但是chrome的收藏夹不支持搜索(虽然有其他插件可以用),收藏的多了以后不好找,而且万一某一天浏览器或系统重装,而没有登录同步数据或者没有导出由的话这些收藏就会丢失. ...
win10计算机添加右键菜单,win10怎么添加右键菜单
为了操作方便.快捷,又需要在桌面图标的右键菜单中添加菜单项目,那怎么添加呢?下面学习啦小编整理了解决win10右键菜单如何添加的方法,希望能帮到大家O(∩_∩)O哈哈~ win10右键菜单如何添加的方 ...
在(CListView)列表视图中添加右键菜单的方法
使用弹出式菜单(PopMenu) 弹出式菜单(PopMenu)大家都熟悉,在WIN98的桌面上单击鼠标右键弹出的菜单就是弹出式菜单.通常情况下,弹出式菜单在鼠标右键单击时弹出,当然,也可以根据需要 ...
java 右键菜单_界面操作--添加右键菜单
[java]代码库package 添加右键菜单; import java.awt.event.MouseAdapter; import java.awt.event.MouseEvent; impor ...
ListCtrl添加右键菜单(ListCtrl类里编辑，给ListCtrl 发送NM_RCLICK消息)
在开发中会用到右键菜单,我们来一起学习一下. 假如,我们现在已经准备好了列表,就差右键处理了. 1.在资源视图中的添加一个MENU,如图 2.给要添加右键菜单的ListCtrl子类,添加消息按 ct ...
merlin.acs的使用方法 merlin.acs添加右键菜单
阅读全文:http://www.cckan.net/forum.php?mod=viewthread&tid=39 看看这个怎么样吧直接看代码吧我就不多说了 1.先下载一下这个控件吧网上 ...
openlayer右键菜单_OpenLayers添加右键菜单
1. 首先修改 OpenLayers Events.js 定位到下面代码段,添加右键菜单事件: View Code OpenLayers.Events = OpenLayers.Class ...

EasyUI 的Tab 标签添加右键菜单

EasyUI 的Tab 标签添加右键菜单相关推荐

最新文章

热门文章