<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. 一步一步从PostgreSQL安装到delphi 访问

    今天,我们使用ubuntu 19 来安装PostgreSQL. 1.直接使用包安装 sudo apt-get install postgresql 按Y,直接安装. 安装完毕. 初次安装后,默认生成一 ...

  2. 环境搭建:添加 xgboost 到 Anaconda

    原文参考:https://blog.csdn.net/lvsehaiyang1993/article/details/80619495 原文博主:Big_quant

  3. 【异常】Zipkin server java.lang.IllegalArgumentException: Prometheus requires that all meters with the same name have the same set of tag keys. There is already an existing meter containing tag keys [meth

    解决办法: 添加下面配置就OK #zipkin启动报错无法访问的解决方法 management.metrics.web.server.auto-time-requests: false

  4. 【Maven】Maven之scope依赖范围

    一.理解Maven scope依赖范围的作用 Maven在编译项目主代码的时候需要使用一套classspath.总共有三种classpath,分别对应于Maven编译项目主代码的时候.Maven编译和 ...

  5. filter-grok,dissect匹配数据

    Grok(正则捕获).Dissect(切分): grok使用正则匹配来提取非结构化日志数并据解析为结构化和可查询的内容. dissect使用多种定界符(非数字和字母的符号,split只能一次只能使用一 ...

  6. SpringCloud2.0 Hystrix Dashboard 断路器指标看板

    原文:https://www.cnblogs.com/songlu/p/9973856.html 1.启动基础工程 1.1.启动[服务中心]集群,工程名称:springcloud-eureka-ser ...

  7. 爬取前程无忧网站上python的招聘信息。

    本文获取的字段有为职位名称,公司名称,公司地点,薪资,发布时间 创建爬虫项目 scrapy startproject qianchengwuyou cd qianchengwuyou scrapy g ...

  8. Normalize.css重置化样式表

    Normalize.css是一种CSS reset的替代方案.它在默认的HTML元素样式上提供了跨浏览器的高度一致性.相比于传统的CSS reset,Normalize.css是一种现代的.为HTML ...

  9. flask实战-个人博客-使用工厂函数创建程序实例 --

    使用工厂函数创建程序实例 使用蓝本还有一个重要的好处,那就是允许使用工厂函数来创建程序实例.在OOP(Object-Oriented Programming,面向对象编程)中,工厂(factory)是 ...

  10. wordpress调用指定tag的文章

    前面的文章wordpress调用指定分类文章如何实现有网友回复要如何调用指定tag的文章,原理是类似的,有两种方法,随ytkah一起来看看 1.第一种 <?php $args=array( 't ...