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 ...
随机推荐
- The server time zone value '�й���ʱ��' is unrecognized or represents more than one time zone 。
The server time zone value '�й���ʱ��' is unrecognized or represents more than one time zone. 今天有Mys ...
- Linux之ubuntu下载
(转载) ubuntu 16.04国内下载地址: 中科大源 http://mirrors.ustc.edu.cn/ubuntu-releases/16.04/ 阿里云开源镜像站 http://mirr ...
- 尾递归 递归函数中,递归调用是整个函数体中最后的语句,且它的返回值不属于表达式的一部分时,这个递归调用就是尾递归,空间复杂度是O(1)
什么是递归深度 递归深度就是递归函数在内存中,同时存在的最大次数. 例如下面这段求阶乘的代码: Java: int factorial(int n) { if (n == 1) { return 1; ...
- beta冲刺总结那周余嘉熊掌将得队
作业格式 课程名称:软件工程1916|W(福州大学) 作业要求:项目Beta冲刺 团队名称: 那周余嘉熊掌将得队 作业目标:beta冲刺总结 队员学号 队员姓名 博客地址 备注 221600131 J ...
- laravel 配置路由 api和web定义的路由的区别详解
1.路由经过中间件方面不同 打开kerenl.php就可以看到区别 protected $middlewareGroups = [ 'web' => [ \App\Http\Middleware ...
- css实现input文本框的双边框美化
<!DOCTYPE html><html><head><meta http-equiv="Content-Type" content=&q ...
- js 复选框回显
<div class="control-group"> <label class="control-label">客户状态:</l ...
- Can总线上的电平及物理层仲裁
CAN总线采用差分信号传输,通常情况下只需要两根信号线(CAN-H和CAN-L)就可以进行正常的通信.在干扰比较强的场合,还需要用到屏蔽地即CAN-G(主要功能是屏蔽干扰信号),CAN协议推荐用户使用 ...
- Event 事件(最简单实用)
public partial class Form1 : Form { /// <summary> /// 定义事件 /// </summary> public event E ...
- yolov3
YOLOv3没有太多的创新,主要是借鉴一些好的方案融合到YOLO里面.不过效果还是不错的,在保持速度优势的前提下,提升了预测精度,尤其是加强了对小物体的识别能力(yolov1在这方面是有缺陷的). 本 ...