首页 > 怎样实现联动选项卡,

怎样实现联动选项卡,

                <li class="active">我的账户</li>
                <li>我的资产</li>
                <li>个人信息</li>
                <li>活动管理</li>
            </ul>
            <div class="userTab"   id="userTabChild">
                <ul class="tabList" id="tabList" style="display: block;" >
                    <li class="active">账户总览</li>
                    <li>交易记录</li>
                    <li>充值提现</li>
                    <li>银行卡管理</li>
                </ul>
                <ul class="tabList" style="display: none;" >
                    <li>我的投资 </li>
                    <li>投资记录</li>
                    <li>回款计划</li>
                    <li>我的借款</li>
                </ul>
                <ul class="tabList" style="display: none;" >
                    <li>#</li>
                </ul>
                <ul class="tabList" style="display: none;" >
                    <li>推广注册</li>
                </ul>
            </div>
            <div class="tabInfoContent" id="tabInfoContent">
                <div class="userInfo">111</div>
                <div class="userInfo">222</div>
                <div class="userInfo">333</div>
                <div class="userInfo">444</div>
            </div>
window.onload = function(){
               var list = document.getElementById("userTab");
               var btn = list.getElementsByTagName('li');
               var listContent = document.getElementById("userTabChild");
               var tabContentWrapper = listContent.getElementsByClassName('tabList');
               
                for( i = 0 ; i < btn.length ; i++ ){
                       btn[i].index = i;
                       btn[i].addEventListener('click' , function(){
                           for( i = 0 ; i < btn.length ; i++ ){
                               btn[i].className = '';
                               tabContentWrapper[i].style.display = 'none';
                           }
                           this.className = 'active';
                           tabContentWrapper[this.index].style.display = 'block';
                       },false);
               }


你把你的那个选项卡 改一下 改成多级联动就好了 ==!

【热门文章】
【热门文章】