H+ 添加(新增)Tab选项卡
//注:在contabs.js文件中 $(function () { }); 方法外 加入
//注: data-name="' + menuName + '" 这句是加入的自定义属性 用于以后通过name属性进行处理 如:通过name属性关闭tab页面
//调用示例 <a href="#" onclick="parent.addMenuTab('index-bootstrap2.html','测试页2','1');">打开index-bootstrap2.html 页</a>
/**
* 添加(新增)选项卡(扩展)
* @param dataUrl 请求路径
* @param menuName tab名称
* @param dataIndex tab标识
* @returns
*/
function addMenuTab(dataUrl,menuName,dataIndex) {
// 获取标识数据
var flag = true;
if (dataUrl == undefined || $.trim(dataUrl).length == 0)return false; // 选项卡菜单已存在
$('.J_menuTab').each(function () {
if ($(this).data('id') == dataUrl) {
if (!$(this).hasClass('active')) {
$(this).addClass('active').siblings('.J_menuTab').removeClass('active');
//scrollToTab(this);
// 显示tab对应的内容区
$('.J_mainContent .J_iframe').each(function () {
if ($(this).data('id') == dataUrl) {
$(this).show().siblings('.J_iframe').hide();
return false;
}
});
}
flag = false;
return false;
}
}); // 选项卡菜单不存在
if (flag) {
var str = '<a href="javascript:;" class="active J_menuTab" data-id="' + dataUrl + '" data-name="' + menuName + '" >' + menuName + ' <i class="fa fa-times-circle"></i></a>';
$('.J_menuTab').removeClass('active'); // 添加选项卡对应的iframe
var str1 = '<iframe class="J_iframe" name="iframe' + dataIndex + '" width="100%" height="100%" src="' + dataUrl + '" frameborder="0" data-id="' + dataUrl + '" data-name="' + menuName + '" seamless></iframe>';
$('.J_mainContent').find('iframe.J_iframe').hide().parents('.J_mainContent').append(str1); // 添加选项卡
$('.J_menuTabs .page-tabs-content').append(str);
//scrollToTab($('.J_menuTab.active'));
}
return false;
}
H+ 添加(新增)Tab选项卡的更多相关文章
- 监听导航新增Tab选项卡-layui
1. 加载element模块 2. 监听导航事件 3. 创建选项卡 //加载element模块 layui.use('element', function () { element = layui.e ...
- iOS开发-iPad侧边栏Tab选项卡切换
Android中习惯了叫侧边栏,iOS中如果不习惯侧边栏称呼的话可以叫dock,侧边栏的切换,类似于Android中的底部导航栏的切换,iPad尺寸大了一些,导航的栏目放在侧边会显示的更好耐看一些.选 ...
- 可轮播滚动的Tab选项卡
前段时间有试着搭建个后台主题ui框架,有用到可支持滚动的Tab选项卡,模仿着H+后台主题ui框架中的代码造轮子改造了下,可惜代码在公司,不能把代码外发出来(感觉这样被限制了很多,对于这样的公司没办法, ...
- android tab选项卡的使用
项目做完了,写写博客,在项目中遇到的一些问题,或者是自己觉得很不错的东西.这一篇主要是想和大家分享一下我在项目中封装的一个东西,就是tab选项卡.先看看效果图: 我在网上看了很多有关选项卡的demo, ...
- js基础练习一之tab选项卡
最近在学习前端,当然包括js,css,html什么的,在听课时做的一些小练习,记录下来: 实例一: --Tab选项卡-- <script type="text/javascript&q ...
- :target伪类制作tab选项卡
:target伪类的作用是突出显示活动的HTML锚,下面是一个简单的例子: HTML代码: <div> <a href="#demo1">点击此处</ ...
- 工作当中实际运用(1)——tab选项卡
不废话 直接上代码: tab选项卡 window.onload=function(){ var titles= document.getElementById('header-dh').getElem ...
- js 实现tab选项卡
最近一直在研究js 如果不及时复习的话前边学到的东西很快就会忘掉,所以把前段时间的一个简单的tab选项卡的思路写出来也算复习了一下吧, 第一步:先把布局写出来: <div id="d ...
- PropertyGrid—添加属性Tab
零.引言 PropertyGrid用来显示和编辑对象的属性,前面已经简单介绍了如何使用该控件和提供不同的属性编辑方法.前面主要讲如何使用该控件,但有时,该控件无法满足我们的需求,就需要对其进行扩展.本 ...
随机推荐
- gradle根据不同渠道设置不同的开屏启动页
需求:根据不同渠道,app的开屏启动页不一样 思路:因为app的启动页是在清单文件配置的,而清单文件最后是要和main里面的清单文件合并的,所以每个渠道都要配一个清单文件,在里面设置 然后在Andro ...
- Android图片缓存框架Glide
Android图片缓存框架Glide Glide是Google提供的一个组件.它具有获取.解码和展示视频剧照.图片.动画等功能.它提供了灵活的API,帮助开发者将Glide应用在几乎任何网络协议栈中. ...
- 动画库NineOldAndroids
动画库NineOldAndroids NineOldAndroids组件是一个向下兼容的动画库,主要是使低于API 11的系统也能够使用View的属性动画.该动画库支持旋转.移动.透明渐变.缩放等 ...
- 51nod 算法马拉松30
题目链接 附一个代码地址 A,这个容斥一下就好了 C,rxd大爷给讲的,首先如果分三种情况(成环,正在比配环,未访问)讨论复杂度是\(3^n * n ^ 2\)的,但是对于每一个环,都可以直接枚举环的 ...
- Shell脚本笔记(九)数组
数组 一)定义 #最常用:小括号加空格: a=( ) #键值对形式: b=([]=x []=men []=z) #定义变量的形式 c[]=; c[]=; c[]= #命令结果作为数组元素 d=($(c ...
- FTL常用标签及语法
判断对象是否存在,若成立说明存在 <#if blockObjList ??></#if> <#if blockObjList ??> <#else> ...
- Python一行代码处理地理围栏
最近在工作中遇到了这个一个需求,用户设定地理围栏,后台获取到实时位置信息后通过与围栏比较,判断是否越界等. 这个过程需要用到数据协议为GEOjson,通过查阅资料后,发现python的shapely库 ...
- [ONTAK2015]Tasowanie
[ONTAK2015]Tasowanie 题目大意: 给你两个长度分别为\(n(n\le2\times10^5)\)的序列\(A,B\),将\(A,B\)进行二路归并,使得最后得到的序列字典序最小.求 ...
- React Native小白入门学习路径——五
React Native小白入门学习路径--五 序 "哦天呐!" 这句话成了我在实验室的口头禅, 老师可能觉得我们都是大神吧,都还在看着基础就给布置了那么多任务:写一个RN的TDD ...
- springboot2、mybatis-plus3 一行配置实现打印sql最终填充的参数值
在application.yml中添加: # 配置slq打印日志 mybatis-plus: configuration: log-impl: org.apache.ibatis.logging.st ...