文档章节

easyui扩展tabs

沉默的懒猫
 沉默的懒猫
发布于 2016/06/20 11:22
字数 234
阅读 32
收藏 0
(function () {
   $.extend($.fn.tabs.methods, {
        getTabById: function(jq,id) {
            var tabs = $.data(jq[0], 'tabs').tabs;
            for(var i=0; i<tabs.length; i++){
                var tab = tabs[i];
                if (tab.panel('options').id == id){
                    return tab;
                }
            }
            return null;
        },
        selectById:function(jq,id) {
            return jq.each(function() {
                var state = $.data(this, 'tabs');
                var opts = state.options;
                var tabs = state.tabs;
                var selectHis = state.selectHis;
                if (tabs.length == 0) {return;}
                var panel = $(this).tabs('getTabById',id); // get the panel to be activated 
                if (!panel){return}
                var selected = $(this).tabs('getSelected');
                if (selected){
                    if (panel[0] == selected[0]){return}
                    $(this).tabs('unselect',$(this).tabs('getTabIndex',selected));
                    if (!selected.panel('options').closed){return}
                }
                panel.panel('open');
                var title = panel.panel('options').title;        // the panel title 
                selectHis.push(title);        // push select history 
                var tab = panel.panel('options').tab;        // get the tab object 
                tab.addClass('tabs-selected');
                // scroll the tab to center position if required. 
                var wrap = $(this).find('>div.tabs-header>div.tabs-wrap');
                var left = tab.position().left;
                var right = left + tab.outerWidth();
                if (left < 0 || right > wrap.width()){
                    var deltaX = left - (wrap.width()-tab.width()) / 2;
                    $(this).tabs('scrollBy', deltaX);
                } else {
                    $(this).tabs('scrollBy', 0);
                }
                $(this).tabs('resize');
                opts.onSelect.call(this, title, $(this).tabs('getTabIndex',panel));
            });
        },
        existsById:function(jq,id){
            return $(jq[0]).tabs('getTabById',id) != null;
        }
    });
})(jQuery);

判断

var isOpen = $('#tabs').tabs('existsById', node.id);
		if (isOpen) {
			$('#tabs').tabs('selectById', node.id);
			var tab = $('#tabs').tabs('getTabById', node.id);
			tab.panel('refresh');
			return;
		}

 

© 著作权归作者所有

共有 人打赏支持
沉默的懒猫
粉丝 7
博文 96
码字总数 36024
作品 0
海淀
程序员
Jquery easyui中tabs新建标签设置href会提交两次请求

Jquery easyui 1.2.4中tabs新建标签设置href会提交两次请求,这个问题应该说是个挺严重的bug,换用1.2.3版本就没有这个问题。猜想easyui是修改了panel的加载机制或缓存机制吧,总之在options...

乌鸦FB
2012/03/27
0
0
jQuery EasyUI使用教程之创建标签页

<jQuery EasyUI最新版下载> 本教程将展示如何使用easyui创建一个标签组件。标签可以动态地添加或删除多个面板,你可以使用标签在同一个页面上显示不同的实体。 标签一次只能显示一个面板,每...

Miss_Hello_World
2015/11/18
0
0
jquery easyui tab加载内容的几种方法

两者特点: href方式加载数据的特点: 被加载的页面只有body元素内部的内容才会被加载,也就是jQuery的ajax请求的只是html片段。 加载远程url时有遮罩效果,也就是“等待中……”效果,用户体...

文文1
2015/03/26
0
0
easyui为tabs添加右键菜单

挂上一图,看看效果,菜单就是easyui的menu组件,使用者可以为菜单选项添加图标,定义样式,甚至可以设置多级结构的菜单。 <div id="rcmenu" class="easyui-menu" style=""><div data-option...

Jialy
2014/04/10
0
1
用户界面框架jQuery EasyUI正式发布v1.4.4[附下载]

jQuery EasyUI致力于帮助web开发者更轻松的打造出功能丰富并且美观的UI界面。jQuery EasyUI提供了基于当下流行的jQuery core和HTML5的控件,助您打造适合当今网络的应用程序。 免费下载:jQu...

Miss_Hello_World
2015/11/09
0
0

没有更多内容

加载失败,请刷新页面

加载更多

企业级 SpringBoot教程(三)SpringBoot用JdbcTemplates访问Mysql

准备工作 jdk 1.8 maven 3.0 idea mysql 初始化mysql: -- create table `account`DROP TABLE `account` IF EXISTSCREATE TABLE `account` ( `id` int(11) NOT NULL AUTO_INCREMENT,......

itcloud
25分钟前
0
0
事务的作用

1. 什么是事务,为什么使用事务? 一、概念: 1.数据库事务: 数据库事务通常指对数据库进行读或写的一个操作序列。 它的存在包含有以下两个目的: 1、为数据库操作提供了一个从失败中恢复到正常...

gaomq
26分钟前
0
0
Web工程师以太坊入门

我经常构建使用以太坊的Web应用程序,我理所当然地认为每天都使用的是神奇的工具集。我们的生态系统正在迅速发展,我认为很多新人都感到不知所措。以太坊是一项了不起的技术,但它也是新生的...

geek12345
29分钟前
0
0
新蠕虫出现:以Linux和Windows为目标

正如Unit 42研究团队所详述的那样,名为Xbash的新恶意软件系列与Iron Group有关,Iron Group是一个以前知道可以执行勒索软件攻击的威胁行为者,显然已经转向更复杂的攻击媒介。 据观察,Xba...

linux-tao
32分钟前
0
0
Mask 动画

前言:很多动效都是多种动画的组合,有时候你可能只是需要其中某个动画,但面对庞杂的代码库或是教程,你可能比较困惑,本系列将复杂动效中不常见的动画效果拆解出来便于学习,授人以鱼不如授...

walking_yxf
32分钟前
0
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部