<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. Redis系列-第六篇哨兵模式

    https://blog.csdn.net/niugang0920/article/details/97141175 Redis的主从复制模式下, 一旦主节点由于故障不能提供服务, 需要人工将从节点晋 ...

  2. nohup-长期运行进程

    我们经常会碰到这样的问题,用 telnet/ssh 登录了远程的 Linux 服务器,运行了一些耗时较长的任务, 结果却由于网络的不稳定导致任务中途失败. 解决办法: 当用户注销(logout)或者网 ...

  3. Git for Windows安装教程

    1.国内直接从官网(http://git-scm.com/download/win)下载比较困难,速度极慢,需要翻墙. 这里提供一个国内的下载站,方便网友下载(https://npm.taobao.o ...

  4. python正则表达式(2)--编译正则表达式re.compile

    编译正则表达式-- re.compile 使用re的一般步骤是先将正则表达式的字符串形 式编译为pattern实例,然后使用pattern实例处理文本并获取匹配结果(一个Match实例(值为True) ...

  5. getLog(this.getClass()) 与 getLog(XXX.class) 的区别

    在实例方法中引用Log,通常定义一个实例变量: // 在实例方法中引用Log: public class Person { protected final Log log = LogFactory.g ...

  6. str = @"abc ""def"" ghi """"jkl"""" mn";

    namespace ConsoleQuotes { class Program { static void Main(string[] args) { string str = @"abc ...

  7. uiwebview 离线缓存 图片

    uiwebview 离线缓存图片

  8. 关于maven导入工程pom文件报错问题及解决

    pom文件头报错 1.导入maven文件,经常遇到表头出错问题.报错:Failure to transfer org.apache.maven.shared:maven-filtering:pom:1 ...

  9. 在Xshell 运行angular 项目时,找不到node-sass模块,安装node-sass模块时,又出现权限问题

    情景再现: 运行时的报错找不到node-sass模块 接着安装node-sass模块出现权限问题 解决方法:既然是权限问题,那么就给项目添加权限指令,在npm前面添加# sudo ,命令如下: 这样就 ...

  10. jQuery--data()方法

    data() 函数用于在当前jQuery对象所匹配的所有元素上存取数据. 通过data()函数存取的数据都是临时数据,一旦页面刷新,之前存放的数据都将不复存在. 该函数属于jQuery对象(实例).如 ...