创建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. Apache mod_jk

    http://tomcat.apache.org/connectors-doc/generic_howto/loadbalancers.html http://tomcat.apache.org/co ...

  2. nosql简述

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

  3. 项目解析- JspLibrary - part2

    banner.jsp 验证用户是否登录 <%String manager=(String)session.getAttribute("manager"); //验证用户是否登 ...

  4. Django开发博客- 三部曲

    其实在django中实现一个功能只需要三个步骤即可,这里我姑且叫它三部曲. 这三部曲就是: 定义urls映射 定义views 定义templates 什么是URL? URL就算一个WEB地址,你在浏览 ...

  5. Python 练习 11

    #!/usr/bin/python # -*- coding: UTF-8 -*- import math for i in range(10000): #转化为整型值 x = int(math.sq ...

  6. Tomcat的测试页打开空白页的解决方法

    win7下安装tomcat 9简要步骤: 1.下载Tomcat 到Tomcat官网https://tomcat.apache.org/download-90.cgi下载Tomcat 9.0>Co ...

  7. 《Java程序设计》学期总结

    <Java程序设计> 学期总结 课程设计小组 -迦瓦栈队 团队博客 读书笔记汇总 第一周 第二周 第三周 第四周 第五周 第六周 第七周 第八周 第九周 第十周 实验报告汇总 实验一 实验 ...

  8. linux下git的安装和使用(转)

    转自:http://www.cnblogs.com/sunada2005/archive/2013/06/06/3121098.html 最近在使用github,感觉不错.在windows下,可使用g ...

  9. sql里Where条件顺序

    以前的理解: sql语句里where后面的条件是否分先后顺序的 ,比如 A and B and C和 C and B and A 是一样,不像C语言 A && B 与B &&a ...

  10. matlab(数组、矩阵)