<ul class="nav nav-tabs" id="otherInfoTab">
<li class="active"><a href="#time_line">时间轴</a></li>
<li><a href="#complain">投诉</a></li>
<li><a href="#sms_send">短信回评</a></li>
<li><a href="#order_path">订单轨迹</a></li>
<li><a href="#order_paths">xxx</a></li>
</ul> <div class="tab-content">
<div class="tab-pane active" id="time_line"></div>
<div class="tab-pane" id="complain"></div>
<div class="tab-pane" id="sms_send"></div>
<div class="tab-pane" id="order_path"></div>
<div class="tab-pane" id="order_paths">zz</div>
</div> <script>
$(function () {
$('#otherInfoTab a:last').tab('show');//初始化显示哪个tab $('#otherInfoTab a').click(function (e) {
e.preventDefault();//阻止a链接的跳转行为
$(this).tab('show');//显示当前选中的链接及关联的content
})
})
</script>

bootstrap Tab页切换的更多相关文章

  1. jquery实现tab页切换显示div

    1.jQuery实现tab切换显示代码实现 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" &q ...

  2. ECSHOP:首页实现显示子分类商品,并实现点击Tab页切换分类商品

    例子:首页实现显示子分类商品,并实现点击Tab页切换分类商品(非AJAX) 开始:    1. 打开调试开关     文件地址:include/cls_template.php 找到 : functi ...

  3. tab页切换

    做了一个tab页切换.点击不同tab,显示对应的内容信息 如图 =================HTML===================== <!doctype html public ...

  4. 用CSS实现Tab页切换效果

    用CSS实现Tab切换效果 最近切一个页面的时候涉及到了一个tab切换的部分,因为不想用js想着能不能用纯CSS的选择器来实现切换效果.搜了一下大致有下面三种写法. 利用:hover选择器 缺点:只有 ...

  5. bootstrap tab页

    ---恢复内容开始--- <!DOCTYPE html> <html> <head> <title>Bootstrap 实例</title> ...

  6. 利用jquery写的一个TAB页切换效果

    函数如下 /** *切换效果 */ function switab(tab,con,tab_c_css,tab_n_css,no) { $(tab).each(function(i){ if(i == ...

  7. 不用jquery实现tab页切换,刷新,后退,前进状态自动维护 很好用

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  8. ReactJS尝鲜:实现tab页切换和菜单栏切换和手风琴切换效果,进度条效果

    前沿 对于React, 去年就有耳闻, 挺不想学的, 前端那么多东西, 学了一个框架又有新框架要学

  9. 小技巧之Selenium如何切换到弹出的Tab页中

    今天群里讨论了一个问题,如何将selenium的操作焦点切换到浏览器中新弹出来的Tab页中,正好对应到了昨天的那篇文章“小技巧之在浏览器中打开新的页签”.今天就带大家来解决这个问题: 先封装一个Tab ...

随机推荐

  1. Struct2远程命令执行漏洞(S2-053)复现学习

    1.S2-053(CVE-2017-12611) RCE出自一道题目 http://www.whalwl.cn:8027/hello.action 漏洞产生原因:Struts2在使用Freemarke ...

  2. Example-based Machine Learning是什么?

    参考:https://christophm.github.io/interpretable-ml-book/proto.html EML简介 Example-based Machine Learnin ...

  3. Distance(2019年牛客多校第八场D题+CDQ+树状数组)

    题目链接 传送门 思路 这个题在\(BZOJ\)上有个二维平面的版本(\(BZOJ2716\)天使玩偶),不过是权限题因此就不附带链接了,我也只是在算法进阶指南上看到过,那个题的写法是\(CDQ\), ...

  4. 项目Beta冲刺(团队)——05.27(5/7)

    项目Beta冲刺(团队)--05.27(5/7) 格式描述 课程名称:软件工程1916|W(福州大学) 作业要求:项目Beta冲刺(团队) 团队名称:为了交项目干杯 作业目标:记录Beta敏捷冲刺第5 ...

  5. 原生js的常用方法总结

    =============== 通知: 博主已迁至<掘金>码字,博客园可能以后不再更新,掘金地址:https://juejin.im/post/5a1a6a6551882534af25a8 ...

  6. cmds jdbc连接写法

    格式一:  Oracle JDBC Thin using a ServiceName: jdbc:oracle:thin:@//<host>:<port>/<servic ...

  7. LoadRunner中,File参数类型--文本参数显示问题

    默认情况,File参数类型,参数数据量只能显示100(参数从0开始,99之后的不显示,但不影响正常取数据) 但是可以修改D:\Program Files (x86)\HP\LoadRunner\con ...

  8. oc语言的特征

    类型结构+运行时 内存管理:引用计数与析构 并发:gcd 函数式:block

  9. Maven整合SSH框架的所有依赖和插件(记录下来,省的以后再写)

    JDK:1.8 Tomcat:7 Maven:3.6.1 调了一个小时,终于没错误了,总结了一个规律,如果在用Tomcat插件启动项目时报错,显示如:org.apache.tomcat.util.bc ...

  10. Implementing the Singleton Pattern in C#

    Table of contents (for linking purposes...) Introduction Non-thread-safe version Simple thread safet ...