最近遇到一个问题,是关于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 下 标签页跳转总结的更多相关文章

  1. selenium+python 浏览器标签页跳转 switch_to_window

    浏览器页面跳转方法记录: from selenium import webdriver import time browser = webdriver.Chrome() first_url='http ...

  2. 使用session处理用户搜索后数据的上一页和下一页跳转

    搜索语句界面: /*单一检索:此处为一个下拉列表的检索*/ if(isset($_POST['submit']) && $_POST['submit'] == '点击搜索') { if ...

  3. PHPCMSv9首页显示分页点击下一页跳转链接出现错误,跳转到后台的解决方案

    1 引用页写为 {pc:content action="lists" catid="10" order="updatetime DESC" ...

  4. bootstrap tab标签页

    <ul id="myTab" class="nav nav-tabs"> <li class="active"> & ...

  5. .Net MVC 标签页

    目录 Bootstrap的标签页 适合.Net MVC的标签页 Bootstrap的标签页 下面是Bootstrap的标签页,挺好的,但是用的id,内容是固定的?我不知道怎么变成不同的视图来 < ...

  6. Bootstrap历练实例:标签页内的下拉菜单

    <!DOCTYPE html><html><head><meta http-equiv="Content-Type" content=&q ...

  7. Bootstrap入门(二十七)JS插件4:标签页

    Bootstrap入门(二十七)JS插件4:标签页 标签页的切换可以带动内容的变化 首先我们引入CSS文件 <link href="bootstrap.min.css" re ...

  8. Bootstrap入门(十二)组件6:导航标签页

    Bootstrap入门(十二)组件6:导航标签页   1.标签页 2.胶囊式标签页 3.垂直展示 4.两端对齐的标签页 5.禁用的链接 6.添加下拉菜单   先引入本地的CSS文件和JS文件(注:1. ...

  9. Bootstrap -- 插件: 模态框、滚动监听、标签页

    Bootstrap -- 插件: 模态框.滚动监听.标签页 1. 模态框(Modal): 覆盖在父窗体上的子窗体. 使用模态框: <!DOCTYPE html> <html> ...

随机推荐

  1. 关于PHP开发的9条建议

    这篇文章主要介绍了关于PHP开发的9条建议,都是个人的一些经验总结,有需要的小伙伴可以参考下. 本文只是个人从实际开发经验中总结的一些东西,并不是什么名言警句,写出来有两个目的:一是时刻提醒自己要按照 ...

  2. 实时的.NET程序错误监控产品Exceptionless开源了

    博客搬到了fresky.github.io - Dawei XU,请各位看官挪步.最新的一篇是:实时的.NET程序错误监控产品Exceptionless开源了.

  3. Linux中查看系统资源占用情况的命令【转载】

      用 'top -i' 看看有多少进程处于 Running 状态,可能系统存在内存或 I/O 瓶颈,用 free 看看系统内存使用情况,swap 是否被占用很多,用 iostat 看看 I/O 负载 ...

  4. centos防火墙操作

    centos防火墙基本操作 #/sbin/iptables -I INPUT -p tcp --dport 80 -j ACCEPT#/sbin/iptables -I INPUT -p tcp -- ...

  5. jquery validate.js表单验证的基本用法入门

    这里转载一篇前辈写的文章,在我自己的理解上修改了一下,仅作记录. 先贴一个国内某大公司的代码: 复制代码 代码如下: <script type="text/javascript&quo ...

  6. 手动安装 mysqldb 与[ pip easy_install]

    mysqldb下载: http://sourceforge.net/projects/mysql-python/ https://sourceforge.net/projects/mysql-pyth ...

  7. 构建tcpdump/wireshark pcap文件

      pcap文件格式是bpf保存原始数据包的格式,很多软件都在使用,比如tcpdump.wireshark等等,了解pcap格式可以加深对原始数据包的了解,自己也可以手工构造任意的数据包进行测试. p ...

  8. 三分钟学会缓存工具DiskLruCache

    DiskLruCache是一个十分好用的android缓存工具,我们可以从GitHub上下载其源码:https://github.com/JakeWharton/DiskLruCache DiskLr ...

  9. sqlite数据库修改及升级

    今天是上班的第二天,听说我最近的任务就是改bug,唉,权当学习了,遇到的一些问题都记录下来. sqlite数据库是android中非常常用的数据库,今天帮别人改bug,遇到一些问题记录下来. 1.修改 ...

  10. Java基础知识强化之网络编程笔记04:UDP之发送端的数据来自于键盘录入案例

    1. 数据来自于键盘录入 键盘录入数据要自己控制录入结束. 2. 代码实现: (1)发送端: package com.himi.updDemo1; import java.io.IOException ...