1. 加入了右击TAB选项卡时显示关闭的上下文菜单
  2.  
  3. 具体实现代码:
  4.  
  5. 右键菜单 HTML:
  6.  
  7. <div id="mm" class="easyui-menu" style="width:150px;">
  8. <div id="mm-tabclose">关闭</div>
  9. <div id="mm-tabcloseall">全部关闭</div>
  10. <div id="mm-tabcloseother">除此之外全部关闭</div>
  11. <div class="menu-sep"></div>
  12. <div id="mm-tabcloseright">当前页右侧全部关闭</div>
  13. <div id="mm-tabcloseleft">当前页左侧全部关闭</div>
  14.  
  15. </div>
  16.  
  17. 下面是js代码:
  18.  
  19. $(function(){
  20. tabClose();
  21. tabCloseEven();
  22. })
  23.  
  24. function tabClose()
  25. {
  26. /*双击关闭TAB选项卡*/
  27. $(".tabs-inner").dblclick(function(){
  28. var subtitle = $(this).children("span").text();
  29. $('#tabs').tabs('close',subtitle);
  30. })
  31.  
  32. $(".tabs-inner").bind('contextmenu',function(e){
  33. $('#mm').menu('show', {
  34. left: e.pageX,
  35. top: e.pageY,
  36. });
  37.  
  38. var subtitle =$(this).children("span").text();
  39. $('#mm').data("currtab",subtitle);
  40.  
  41. return false;
  42. });
  43. }
  44. //绑定右键菜单事件
  45. function tabCloseEven()
  46. {
  47. //关闭当前
  48. $('#mm-tabclose').click(function(){
  49. var currtab_title = $('#mm').data("currtab");
  50. $('#tabs').tabs('close',currtab_title);
  51. })
  52. //全部关闭
  53. $('#mm-tabcloseall').click(function(){
  54. $('.tabs-inner span').each(function(i,n){
  55. var t = $(n).text();
  56. $('#tabs').tabs('close',t);
  57. });
  58. });
  59. //关闭除当前之外的TAB
  60. $('#mm-tabcloseother').click(function(){
  61. var currtab_title = $('#mm').data("currtab");
  62. $('.tabs-inner span').each(function(i,n){
  63. var t = $(n).text();
  64. if(t!=currtab_title)
  65. $('#tabs').tabs('close',t);
  66. });
  67. });
  68.  
  69. //关闭当前右侧的TAB
  70. $('#mm-tabcloseright').click(function(){
  71. var nextall = $('.tabs-selected').nextAll();
  72. if(nextall.length==0){
  73. //msgShow('系统提示','后边没有啦~~','error');
  74. alert('后边没有啦~~');
  75. return false;
  76. }
  77. nextall.each(function(i,n){
  78. var t=$('a:eq(0) span',$(n)).text();
  79. $('#tabs').tabs('close',t);
  80. });
  81. return false;
  82. });
  83. //关闭当前左侧的TAB
  84. $('#mm-tabcloseleft').click(function(){
  85. var prevall = $('.tabs-selected').prevAll();
  86. if(prevall.length==0){
  87. alert('到头了,前边没有啦~~');
  88. return false;
  89. }
  90. prevall.each(function(i,n){
  91. var t=$('a:eq(0) span',$(n)).text();
  92. $('#tabs').tabs('close',t);
  93. });
  94. return false;
  95. });
  96. }

为jQuery-easyui的tab组件添加右键菜单功能的更多相关文章

  1. 为EasyUI 的Tab 标签添加右键菜单

    在网上看了很多demo 自己实现了一个效果如下 ps jquery1.7.2 jQuery EasyUI 1.3.6easyui QQ群:15129679 <!doctype html> ...

  2. EasyUI 的Tab 标签添加右键菜单

    样式: 主要提供右键功能代码. (只需要提供你需要的js和css就行了) <!doctype html> <html> <head> <base href=& ...

  3. 仅在TabControl中的Tab中添加右键菜单

    若想实现仅在TabControl中的Tab中添加右键菜单,可在XAML中通过使用样式得到: <TabControl> <TabControl.ItemContainerStyle&g ...

  4. 使用easyui为tab页增加右键菜单

    在使用easyui进行上左右布局一文中,我们已经使用easyui搭建起了一个简单的上左右布局.在使用的过程中,我们经常会遇到tab页打开的太多,但只能一个一个的关闭的烦恼,这个时候有没有想到eclip ...

  5. easyui tab上面添加右键菜单

    说扩展,我觉得有点过了,只是加入了右击TAB选项卡时显示关闭的上下文菜单,先看下效果图: 具体实现代码: 右键菜单 HTML: <div id="mm" class=&quo ...

  6. Jquery EasyUI中treegrid的中右键菜单和一般按钮同时绑定事件时的怪异事件

    做个项目使用jquery  easyui来做前端,也许是对此不是很熟悉,总是发现一些不可理解的事件. 主要源代码如下: <script type="text/javascript&qu ...

  7. jquery easyui 中tab页添加其他页面,href与content的用法与区别

    //tab页增加 function addPanel(name,url){ var dd = $('#tt').tabs('exists',name); if(dd){ $('#tt').tabs(' ...

  8. 给jquery easy-ui 添加右键菜单

    版权声明:转自为EasyUI 的Tab 标签添加右键菜单

  9. pyqt5-为QListWidget添加右键菜单

    如何在pyqt5下为QListWidget添加右键菜单? 能百度到的均是pyqt4下的,有些貌似并不好用. 在尝试了很多方法后,下面贴出可用的方法: from PyQt4 import QtCore, ...

随机推荐

  1. Python - 001 - 类与实例间属性的理解

    Python是个很灵活的语言,光看它的类和实例间属性的访问机制就可以看出这一点,不过这一点还真的不好理解,做了些测试之后我的理解是这样的: 实例在访问class属性时,先检索自己的names, 如果有 ...

  2. SQL Server的小数数值类型(float 和 decimal)用法

    在SQL Server中,小数数值实际上只有两种数据类型:float 和 decimal.double precision 整体是数据类型,等价于 float(53),real等价于float(24) ...

  3. Dijkstra算法(一)之 C语言详解

    本章介绍迪杰斯特拉算法.和以往一样,本文会先对迪杰斯特拉算法的理论论知识进行介绍,然后给出C语言的实现.后续再分别给出C++和Java版本的实现. 目录 1. 迪杰斯特拉算法介绍 2. 迪杰斯特拉算法 ...

  4. AngularJS入门心得2——何为双向数据绑定

    前言:谁说Test工作比较轻松,最近在熟悉几个case,差点没疯.最近又是断断续续的看我的AngularJS,总觉得自己还是没有入门,可能是自己欠前端的东西太多了,看不了几行代码就有几个常用函数不熟悉 ...

  5. 推荐10个 CSS3 制作的创意下拉菜单效果

    下拉菜单是一个很常见的效果,在网站设计中被广泛使用.通过使用下拉菜单,设计者不仅可以在网站设计中营造出色的视觉吸引力,但也可以为网站提供了一个有效的导航方案.使用 HTML5 和 CSS3 可以更容易 ...

  6. NASA的下一个十年(译)

    原文 MICHAEL ROSTON (New York Times) 从左起:木卫二:土卫六:经过火星的水手谷星的合成图:金星的拼接图 大多数人已经从人类第一次近距离看到冥王星的兴奋中冷静下来.下一个 ...

  7. 对于MVC中应用百度富文本编辑器问题的解决办法

    1.对于应用富文本编辑器post提交表单内容提示有危险的解决办法: [ValidateInput(false)] //文本编辑器的表单提交不用提示危险 [HttpPost] public Action ...

  8. Android抓包方法(二)之Tcpdump命令+Wireshark

    Android抓包方法(二) 之Tcpdump命令+Wireshark 前言 做前端测试,基本要求会抓包,会分析请求数据包,查看接口是否调用正确,数据返回是否正确,问题产生是定位根本原因等.学会抓包分 ...

  9. 为什么是梯度下降?SGD

    在机器学习算法中,为了优化损失函数loss function ,我们往往采用梯度下降算法来进行优化.举个例子: 线性SVM的得分函数和损失函数分别为:                         ...

  10. Fiddler使用AutoResponder进行本地文件和线上文件的映射

    直入正题.. 刚刚想写篇总结,照常登上博客园添加新随笔,写了百来字发现有什么不对劲 编辑器去哪儿了... 心想重新登录应该就OK了吧,点击退出然后重新登录 按钮一直显示加载中...简直就没法登录嘛.. ...