EasyUI 的Tab 标签添加右键菜单
2024-06-14 07:18:07
样式：
主要提供右键功能代码。
(只需要提供你需要的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 ...
最新文章
- 概率论与数理统计（一）
- oracle11G在linux环境下的卸载操作
- c++ map利用迭代器赋值
- ORACLE 执行计划分析
- 【BZOJ 2298】 2298: [HAOI2011]problem a （DP）
- 【week2】 构建之法 读后感及问题
- Nginx配置IP地址的动态黑名单
- Typora+PicGo+github搭建免费稳定图床写博客如行云流水（mac+window）
- mfc按钮名称怎么换行_MFC中解决回车键关闭窗口的一般方法
- 参数化CFAR的FPGA实现
- 如何在没有手机号的情况下注册Yahoo邮箱
- Azure微软云（部署一台虚拟机云服务器）
- 一个简单的出货补货网页php
- Spring Security OAuth2搭建认证授权中心、资源服务中心、并结合网关校验的完整详细示例
- 一篇文章了解爬虫技术现状
- linux 赋权文件,linux文件赋权
- RabbitMQ 中的 VirtualHost 该如何理解
- 旋转矩阵、变换矩阵，李群（Lie Group）、李代数（Lie Algebra）及扰动模型
- 修图软件：Affinity Photo for Mac
- php-fpm 如果dm设置为 static，那么其实只有pm.max_children这个参数生效。系统会开启设置数量的php-fpm进程。...