bootstrap Tab页切换
<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页切换的更多相关文章
- jquery实现tab页切换显示div
1.jQuery实现tab切换显示代码实现 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" &q ...
- ECSHOP:首页实现显示子分类商品,并实现点击Tab页切换分类商品
例子:首页实现显示子分类商品,并实现点击Tab页切换分类商品(非AJAX) 开始: 1. 打开调试开关 文件地址:include/cls_template.php 找到 : functi ...
- tab页切换
做了一个tab页切换.点击不同tab,显示对应的内容信息 如图 =================HTML===================== <!doctype html public ...
- 用CSS实现Tab页切换效果
用CSS实现Tab切换效果 最近切一个页面的时候涉及到了一个tab切换的部分,因为不想用js想着能不能用纯CSS的选择器来实现切换效果.搜了一下大致有下面三种写法. 利用:hover选择器 缺点:只有 ...
- bootstrap tab页
---恢复内容开始--- <!DOCTYPE html> <html> <head> <title>Bootstrap 实例</title> ...
- 利用jquery写的一个TAB页切换效果
函数如下 /** *切换效果 */ function switab(tab,con,tab_c_css,tab_n_css,no) { $(tab).each(function(i){ if(i == ...
- 不用jquery实现tab页切换,刷新,后退,前进状态自动维护 很好用
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- ReactJS尝鲜:实现tab页切换和菜单栏切换和手风琴切换效果,进度条效果
前沿 对于React, 去年就有耳闻, 挺不想学的, 前端那么多东西, 学了一个框架又有新框架要学
- 小技巧之Selenium如何切换到弹出的Tab页中
今天群里讨论了一个问题,如何将selenium的操作焦点切换到浏览器中新弹出来的Tab页中,正好对应到了昨天的那篇文章“小技巧之在浏览器中打开新的页签”.今天就带大家来解决这个问题: 先封装一个Tab ...
随机推荐
- Redis系列-第六篇哨兵模式
https://blog.csdn.net/niugang0920/article/details/97141175 Redis的主从复制模式下, 一旦主节点由于故障不能提供服务, 需要人工将从节点晋 ...
- nohup-长期运行进程
我们经常会碰到这样的问题,用 telnet/ssh 登录了远程的 Linux 服务器,运行了一些耗时较长的任务, 结果却由于网络的不稳定导致任务中途失败. 解决办法: 当用户注销(logout)或者网 ...
- Git for Windows安装教程
1.国内直接从官网(http://git-scm.com/download/win)下载比较困难,速度极慢,需要翻墙. 这里提供一个国内的下载站,方便网友下载(https://npm.taobao.o ...
- python正则表达式(2)--编译正则表达式re.compile
编译正则表达式-- re.compile 使用re的一般步骤是先将正则表达式的字符串形 式编译为pattern实例,然后使用pattern实例处理文本并获取匹配结果(一个Match实例(值为True) ...
- getLog(this.getClass()) 与 getLog(XXX.class) 的区别
在实例方法中引用Log,通常定义一个实例变量: // 在实例方法中引用Log: public class Person { protected final Log log = LogFactory.g ...
- str = @"abc ""def"" ghi """"jkl"""" mn";
namespace ConsoleQuotes { class Program { static void Main(string[] args) { string str = @"abc ...
- uiwebview 离线缓存 图片
uiwebview 离线缓存图片
- 关于maven导入工程pom文件报错问题及解决
pom文件头报错 1.导入maven文件,经常遇到表头出错问题.报错:Failure to transfer org.apache.maven.shared:maven-filtering:pom:1 ...
- 在Xshell 运行angular 项目时,找不到node-sass模块,安装node-sass模块时,又出现权限问题
情景再现: 运行时的报错找不到node-sass模块 接着安装node-sass模块出现权限问题 解决方法:既然是权限问题,那么就给项目添加权限指令,在npm前面添加# sudo ,命令如下: 这样就 ...
- jQuery--data()方法
data() 函数用于在当前jQuery对象所匹配的所有元素上存取数据. 通过data()函数存取的数据都是临时数据,一旦页面刷新,之前存放的数据都将不复存在. 该函数属于jQuery对象(实例).如 ...