jQuery Easyui Tabs扩展根据自定义属性打开页签


Posted in Javascript onAugust 15, 2016

easyui是一个轻量级的后台管理系统框架,各种组件均有,使用简单方便,现在已经有免费版的License了。

1.增加扩展

<script type="text/javascript" >
/**
* @author {kexb} easyui-tab扩展根据id切换页面
*/
$.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) {
var tab;
var tabs = $.data(jq[0], 'tabs').tabs;
for (var i = 0; i < tabs.length; i++) {
tab = tabs[i];
if (tab.panel('options').id == id) {
break;
}
}
if (tab != undefined) {
var curTabIndex = $("#tabs").tabs("getTabIndex", tab);
$('#tabs').tabs('select', curTabIndex);
}
},
existsById: function (jq, id) {
return jq.tabs('getTabById', id) != null;
}
});
</script>

2.点击事件open方法

function Open(text, url, id) {
var tabId = ReplaceAll(url, '/','');
var h = ComputGridHeight();
if (url == "null" || url == "" || url == "") {
return;
}
if ($("#tabs").tabs("existsById", tabId)) {
$("#tabs").tabs("selectById", tabId);
}
else
{
if (url.indexOf("?") < 0) {
url += "?_menuId=" + id;
}
else {
url += "&_menuId=" + id;
}
$('#tabs').tabs('add', {
id:tabId,
title: text,
closable: true,
content: createTabContent(url, h),
url: url
});
}
}

以上所述是小编给大家介绍的jQuery Easyui Tabs扩展根据自定义属性打开页签 ,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
Js 订制自己的AlertBox(信息提示框)
Jan 09 Javascript
zShowBox 图片放大展示jquery版 兼容性
Sep 24 Javascript
JQuery入门——用bind方法绑定事件处理函数应用介绍
Feb 05 Javascript
jQuery中innerWidth()方法用法实例
Jan 19 Javascript
jQuery实现在列表的首行添加数据
May 19 Javascript
Jquery attr()方法 属性赋值和属性获取详解
Apr 15 Javascript
基于bootstrap按钮式下拉菜单组件的搜索建议插件
Mar 25 Javascript
JS实现验证码倒计时的注册页面
Jan 02 Javascript
Webpack 4.x搭建react开发环境的方法步骤
Aug 15 Javascript
JS原型与继承操作示例
May 09 Javascript
javascript中undefined的本质解析
Jul 31 Javascript
vue调用语音播放的方法
Sep 27 Javascript
浅谈js中字符和数组一些基本算法题
Aug 15 #Javascript
jQuery Easyui DataGrid点击某个单元格即进入编辑状态焦点移开后保存数据
Aug 15 #Javascript
jQuery EasyUI datagrid在翻页以后仍能记录被选中行的实现代码
Aug 15 #Javascript
jQuery Easyui Datagrid实现单行的上移下移及保存移动的结果
Aug 15 #Javascript
关于动态执行代码(js的Eval)实例详解
Aug 15 #Javascript
jQuery Ajax Post 回调函数不执行问题的解决方法
Aug 15 #Javascript
对js eval()函数的一些见解
Aug 15 #Javascript
You might like
PHP函数学习之PHP函数点评
2012/07/05 PHP
利用php下载xls文件(自己动手写的)
2014/04/18 PHP
php设置静态内容缓存时间的方法
2014/12/01 PHP
FireFox与IE 下js兼容触发click事件的代码
2008/11/20 Javascript
javascript 获取select下拉列表值的代码
2009/09/07 Javascript
Javascript 模式实例 观察者模式
2009/10/24 Javascript
javascript权威指南 学习笔记之null和undefined
2011/09/25 Javascript
javascript面向对象之定义成员方法实例分析
2015/01/13 Javascript
JS实现网页右侧带动画效果的伸缩窗口代码
2015/10/29 Javascript
js实现模拟银行卡账号输入显示效果
2015/11/18 Javascript
Node.js配合node-http-proxy解决本地开发ajax跨域问题
2016/08/31 Javascript
浅谈angularjs依赖服务注入写法的注意点
2017/04/24 Javascript
原生JS实现Ajax跨域请求flask响应内容
2017/10/24 Javascript
利用vue.js把静态json绑定bootstrap的table方法
2018/08/28 Javascript
微信小程序云开发实现数据添加、查询和分页
2019/05/17 Javascript
JavaScript canvas绘制圆弧与圆形
2020/02/18 Javascript
JavaScript交换变量的常用方法小结【4种方法】
2020/05/07 Javascript
javascript canvas实现简易时钟例子
2020/09/05 Javascript
[01:03:36]Ti4 循环赛第三日DK vs Titan
2014/07/12 DOTA
关于你不想知道的所有Python3 unicode特性
2014/11/28 Python
Python中的对象,方法,类,实例,函数用法分析
2015/01/15 Python
微信跳一跳python辅助脚本(总结)
2018/01/11 Python
Matplotlib中文乱码的3种解决方案
2018/11/15 Python
详解python中@的用法
2019/03/27 Python
在pytorch中为Module和Tensor指定GPU的例子
2019/08/19 Python
Python configparser模块应用过程解析
2020/08/14 Python
CSS3实现多背景展示效果通过CSS3定位多张背景
2014/08/10 HTML / CSS
iHerb香港:维生素、补充剂和天然保健品
2017/08/01 全球购物
寻找完美的房车租赁:RVShare
2019/02/23 全球购物
Myprotein法国官网:欧洲第一运动营养品牌
2019/03/26 全球购物
英国书籍、CD、DVD和游戏的第一道德零售商:Awesome Books
2020/02/22 全球购物
如何撰写岗位职责
2014/02/01 职场文书
商超业务员岗位职责
2014/03/12 职场文书
检举信的格式及范文
2014/04/04 职场文书
哈姆雷特读书笔记
2015/06/29 职场文书
导游词之茶卡盐湖
2019/11/26 职场文书