创建navtab

创建一个navtab有以下两种方式:

1、Data属性:DOM添加属性data-toggle="navtab"后,单击触发。

a链接示例:

<a href="form/other.jsp" data-toggle="navtab" data-id="mynavtab" data-reload-warn="已打开业务界面,确认将重新载入?" data-title="我的业务界面">打开navtab</a>

按钮示例:

<button type="button" class="btn-green" data-toggle="navtab" data-id="mynavtab" data-title="我的业务界面" data-reload-warn="已打开业务界面,确定将重新载入?" data-url="form/other.jsp">打开navtab</button>

参数集合写法:

<button type="button" class="btn btn-blue" data-toggle="navtab"
data-options="{id:'mynavtab',reloadWarn:'已打开业务界面,确认将重新载入?',url:'form/other.jsp',title:'我的业务界面(参数集合写法)'}">打开navtab</button>

其他示例(回调函数)

<script type="text/javascript">
function doc_navtab_beforeClose($navtab){
var code=$navtab.find("#doc-mytab-code").val();
if(code) return true;
$navtab.alertmsg('error','关闭navtab前请先输入你的工号');
return false;
}
function doc_navtab_onClose(){
$(this).alertmsg('info','你刚刚关闭了一个navtab');
}
</script>
<button type="button" class="btn-green" data-toggle="navtab" data-id="mynavtab" data-reload-warn="已打开业务界面,确认将重新载入?" data-url="form/other.jsp"
data-title="navtab回调函数示例" data-before-close="doc_navtab_beforeClose" data-on-close="doc_navtab_onClose">打开navtab</button>

2、jqueryAPI的方式

<script type="text/javascript">
function openMytab(obj){
$(obj).navtab({id:'mynavtab', url:'form/other.jsp', title:'我的业务界面'});
}
</script>
<button type="button" class="btn btn-default" onclick="openMytab(this)">打开navtab</button>

jqueryAPI代码:

$(selector).navtab(options);

注意:

1、取得当前navtab的内容容器:$.CurrentNavtab

2、创建已存在相同ID的navtab时,如果url一致(未设置refresh参数时),默认会直接切换到该navtab,否则覆盖已存在的navtab,可以增加reloadWarn参数以获得警告提醒。

标签navtab的更多相关文章

  1. bjui给出的一个标准应用的首页

    <!DOCTYPE html> <html lang="zh"> <head> <meta charset="utf-8&quo ...

  2. 标签工作区(navtab)

    B-JUI使用标签可以加载其他页面的数据 B-JUI框架的整个工作区部分就是一个navtab组件,本页面位于"#bjui-container"容器内,固定的html结构如下: &l ...

  3. navtab方法参数以及事件

    参数(options) DOM方式初始化navtab的,推荐使用集合属性data-options定义参数,如果使用data属性定义参数,注意转换成对应的名称. 名称 类型 默认值 描述 id stri ...

  4. <s:if>标签与ActionContext.getContext().getSession()

    今天在做<s:if>标签中的属性值从 ActionContext.getContext().getSession().put("WW_TRANS_I18N_LOCALE" ...

  5. Bootstrap入门(十二)组件6:导航标签页

    Bootstrap入门(十二)组件6:导航标签页   1.标签页 2.胶囊式标签页 3.垂直展示 4.两端对齐的标签页 5.禁用的链接 6.添加下拉菜单   先引入本地的CSS文件和JS文件(注:1. ...

  6. DWZ SSH2 菜单树--使用Struts2 标签(iterator/set/if 组合使用)

    最近在研究DWZ框架,然后要写一个菜单树,后台我使用了SSH2,然后想把菜单通过后台传过来的对象展示出来. 但是,发现应用样式的时候,如果子菜单在子循环中为空的话,会多出一对空标签“<ul> ...

  7. a标签点击跳转失效--IE6、7的奇葩bug

    一般运用a标签包含img去实现点击图片跳转的功能,这是前端经常要用到的东西. 今天遇到个神奇的bug:如果在img上再包裹一层div,而且div设置了width和height,则图片区域点击时,无任何 ...

  8. IE6、7下html标签间存在空白符,导致渲染后占用多余空白位置的原因及解决方法

    直接上图:原因:该div包含的内容是靠后台进行print操作,输出的.如果没有输出任何内容,浏览器会默认给该空白区域添加空白符.在IE6.7下,浏览器解析渲染时,会认为空白符也是占位置的,默认其具有字 ...

  9. 百度MIP页规范详解 —— canonical标签

    百度MIP的规范要求必须添加强制性标签canonical,不然MIP校验工具会报错: 强制性标签<link rel="/^(canonical)$/"> 缺失或错误 这 ...

随机推荐

  1. JMX 简介 和 实例

    What is JMX? 10 mins Quick Start JMX Tutorial 这篇文章作为入门,非常清楚

  2. maven install 报错Failed to execute goal org.apache.maven.plugins:maven-compiler-plugin:3.1:compile (default-compile) on project*****

    [ERROR]Failed to execute goal org.apache.maven.plugins:maven-compiler-plugin:3.1:compile (default-co ...

  3. nosql简述

    1.NoSQL数据库概念 NoSQL数据库是非关系型数据库,主要是针对关系型数据库而言,它主要是用来解决半结构化数据和非机构化数据的存储问题. 2.为什么使用NoSQL数据库? (1)对数据库的高并发 ...

  4. 堆排序(C语言)

    #ifndef HEAP_SORT_H #define HEAP_SROT_H #include<iostream> void maxHeap(int *arr,unsigned int ...

  5. C 语言字符串连接的 3种方式

    C 语言字符串连接的 3种方式 #include<stdio.h> #include<stdlib.h> #include<string.h> char *join ...

  6. 在IIS7.5打开网页的时候,提示: HTTP 错误 500.0 - Internal Server Error 调用 LoadLibraryEx 失败,在 ISAPI 筛选器 "C:\Windows\Microsoft.NET\Framework\v4.0.30319\\aspnet_filter.dll" 上。解决方法

  7. Linux基础:软件安装(rpm,yum,源代码)

    Software Installation on Linux Linux安装分为rpm包(可通过yum或者是rpm命令安装)和源码包(源代码或者是编译过的二进制码)两种. Linux是开源系统,很多应 ...

  8. hdu----(5055)Bob and math problem(贪心)

    Bob and math problem Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Oth ...

  9. Run “mvn clean install” in Eclipse

    1.在Maven项目或者pom.xml上右键-->Run As -->"Maven Build..."或者"Run Configuration-->Ma ...

  10. easyui $.parser.parse 页面重新渲染

    一些dom元素是动态拼接上的easui的样式,由于页面已经渲染过了,所以需要手动执行渲染某个部件或者整个页面 $.parser.parse(); // parse all the page $.par ...