用JS怎么控制tab标签页的默认tab



如图,此页面进来后默认是选中第一个tab页的,我想用JS控制到进入此页面可以默认选中第二个tab页(我后台传值到前端做判断来选中第几个tab页(根据我的需要)) ,tab相关代码如下:

备注:我百度了好多种方式都未能成功改变默认tab页

<div class="tabbable" >

            <ul class="nav nav-tabs padding-12 tab-color-blue background-blue" id="myTab">
                <li class="active"> <a data-toggle="tab" href="#tab1">企业基础信息</a> </li>
                
                <c:if test="${companyinfo.companyId!=null}">
                <li> <a data-toggle="tab" href="#tab2" >合作协议管理</a> </li>
                </c:if>
            </ul>
            
            <div class="tab-content" style="height: 1000px; font-size:13px;background:#ffffff;">
            
                <!-- 1.基础信息  -->
                <div  id="tab1"  class="tab-pane in active " style="width:100%;">
                <!--  此处为Tab页的主体内容 -->
                
                <!-- 2.合作协议管理 -->  
                <div id="tab2" class="tab-pane "  >

楼上方法就可以了,直接触发你要显示的tab的click事件就行了。
但是一定要注意的是“一定要在标签加载完以后执行click的js代码!


经过几天的研究弄出一个方法,大家遇到类似的问题可以参考,直接在JS代码增加如下:
<script type="text/javascript">

    $(function(){
        
        //判断
        if("success" == $("#ADD").val()){
        $(".nav-tabs>li").eq(1).addClass("active");
        $(".nav-tabs>li").eq(0).removeClass("active");
        $("#tab2").addClass("tab-pane in active");
        $("#tab1").removeClass("tab-pane in active").addClass("tab-pane");
        }
   });  </script>
   
   发现li中有class="active"和  <div  id="tab1"  class="tab-pane in active " style="width:100%;">   中的class="tab-pane in active"则为默认显示的标签页标题和内容,
   对应的li没有class="active"  和<div id="tab2" class="tab-pane "  >中class="tab-pane "为未显示的标签及内容,利用这一点用JS来控制,按自己需要从后台传值做判断就可以了

最简单的做法就是加载完成之后、合作协议管理这个标签触发一次click事件

选中它的方式就很多种了啊、根据你nav下面的下标和后台传的值作比较



相关阅读:
react router的Link组件的activeStyle增加多个样式应该怎么处理?
关于 iOS 集成支付宝 SDK 实现移动支付,获取同步结果崩溃
请问,reactjs官方get start教程看完了,还是不会,后面该看什么?
安卓机微信上的animation和svg的兼容处理
打包后的apk更换后缀名为zip之后,不能解压
怎么用js实现页面的局部刷新
自用Android壳与webview JS交互怎么传递数据给js内回调,像微信那样。
js setInterval()一直开着 不clear掉 有什么影响吗?
在下面的这段代码中输出的怎么不是b呀?
css跨域字体不发生请求?
《Python编程:从入门到实践》第十二章,外星人入侵实例中无法获取键盘按键和退出游戏
动态生成的标签,怎么添加点击事件打开对应的内容网页?
请问.net 的Encoding.UTF8.GetBytes和Encoding.Unicode.GetBytes分别作了什么?
指定域名,无法访问本地node项目(配置server.js端口为3333) 开发工具:webstorm
如何记录每次点击的选中项,并验证值和答案是否一致?
求教php正则替换怎么写
关于thinkphp中的行为扩展和laravel中的中间件
为什么我的eclipse che在docker中运行不起来?
如果通过url传参显示不同的页面
ng-clas的使用问题



快速导航

Copyright © 2016 phpStudy |