bootstrap 下 标签页跳转总结
最近遇到一个问题,是关于bootstrap中的标签页实现上的一些功能实现,现总结一下。
问题描述:点击其他标签页后,如何在点击搜索按钮后自动跳转到第一个标签页。如下图

通过对bootstrap框架里的对选项卡操作的代码后,发现简单的用一句 $(".nav-tabs a:first").tab('show');即可实现。具体代码如下:
$("#search").click(function(){ //单击搜索按钮
var systems = $("#system").val();
var beginTimes = $("#beginTime").val();
var endTimes = $("#endTime").val();
getTaskList(systems,beginTimes,endTimes,'Task',1);
$(function(){
$(".nav-tabs a:first").tab('show');
});
});
bootstrap中,对标签页操作的代码:
$(function () {
$("#tabs1 a").click(function (e) {
$(this).tab('show');
});
$("#tabs2 a").click(function (e) {
$(this).tab('show');
});
$("#tabs3 a").click(function (e) {
$(this).tab('show');
});
$("#tabs4 a").click(function (e) {
$(this).tab('show');
});
});
bootstrap 下 标签页跳转总结的更多相关文章
- selenium+python 浏览器标签页跳转 switch_to_window
浏览器页面跳转方法记录: from selenium import webdriver import time browser = webdriver.Chrome() first_url='http ...
- 使用session处理用户搜索后数据的上一页和下一页跳转
搜索语句界面: /*单一检索:此处为一个下拉列表的检索*/ if(isset($_POST['submit']) && $_POST['submit'] == '点击搜索') { if ...
- PHPCMSv9首页显示分页点击下一页跳转链接出现错误,跳转到后台的解决方案
1 引用页写为 {pc:content action="lists" catid="10" order="updatetime DESC" ...
- bootstrap tab标签页
<ul id="myTab" class="nav nav-tabs"> <li class="active"> & ...
- .Net MVC 标签页
目录 Bootstrap的标签页 适合.Net MVC的标签页 Bootstrap的标签页 下面是Bootstrap的标签页,挺好的,但是用的id,内容是固定的?我不知道怎么变成不同的视图来 < ...
- Bootstrap历练实例:标签页内的下拉菜单
<!DOCTYPE html><html><head><meta http-equiv="Content-Type" content=&q ...
- Bootstrap入门(二十七)JS插件4:标签页
Bootstrap入门(二十七)JS插件4:标签页 标签页的切换可以带动内容的变化 首先我们引入CSS文件 <link href="bootstrap.min.css" re ...
- Bootstrap入门(十二)组件6:导航标签页
Bootstrap入门(十二)组件6:导航标签页 1.标签页 2.胶囊式标签页 3.垂直展示 4.两端对齐的标签页 5.禁用的链接 6.添加下拉菜单 先引入本地的CSS文件和JS文件(注:1. ...
- Bootstrap -- 插件: 模态框、滚动监听、标签页
Bootstrap -- 插件: 模态框.滚动监听.标签页 1. 模态框(Modal): 覆盖在父窗体上的子窗体. 使用模态框: <!DOCTYPE html> <html> ...
随机推荐
- canvas 俄罗斯方块
<!doctype html> <html> <body> <canvas id="can" width="360px" ...
- CMDB机柜平台结合zabbix告警展示
前段时间看了刘天斯老师的机柜展示平台,非常绚丽,而且有大屏显示的话也是能够体现运维价值的.刚好最近自己也在协助朋友做一个开源的CMDB平台,这里就说下我们CMDB平台的一些数据: 开源项目地址:Git ...
- linux安装apache软件的过程
参考官方安装指导:http://httpd.apache.org/docs/2.4/install.html 1.下载依赖包 apr/apr-util/pcre 2.解压依赖包 3.安装apr 进入安 ...
- action使用大全
1.Intent的用法: (1)Action跳转 1. 使用Action跳转,当程序AndroidManifest.xml中某一个 Activity的IntentFilter定义了包含Action, ...
- eclipse+tomcat+httpServlet初学
1.在eclipse中配置tomcat,参考上一边文章,建立的web项目tomcatWeb目录结构 2.添加Servlet处理类 3. 实现doGet()与doPost()方法: <span s ...
- spring applicationContext.xml 文件
<?xml version="1.0" encoding="UTF-8"?> <beans xmlns="http://www.sp ...
- C的printf与scanf的用法
之前没学过C语言,只学过C++,所以就来自学下C语言了,其实个人认为C与C++的区别很小,基本上就是printf与scanf这点输出和输入的区别了,如果还有什么区别的话那就是要包含的头文件是不同的.比 ...
- 系统的启动模式(启动级别)的改动---使用upstart启动机制的
/********************************************************************* * Author : Samson * Date ...
- 开源免费天气预报接口API以及全国全部地区代码!!(国家气象局提供)
国家气象局提供的天气预报接口 接口地址: http://www.weather.com.cn/data/sk/101010100.html http://www.weather.com.cn/data ...
- linux之ioctl函数解析
[lingyun@localhost ioctl_1]$ ls ipconfig.c [lingyun@localhost ioctl_1]$ cat ipconfig.c /*********** ...