一个 jQuery循环获取点击事件,显示tab 子页

 html 代码

<div class="data_bodey">
    <div class="index_nav" >
        <ul style="height: 30px; margin-bottom: 0px;">
            <li class="l_left total_chose_fr nav_active">实时监测</li>
            <li class="l_left total_chose_pl" >统计分析一</li>
            <li class="l_left total_chose_pl">统计分析二</li>
            <li class="r_right total_chose_pl">统计分析三</li>
            <li class="r_right total_chose_pl">统计分析四</li>
            <li class="r_right total_chose_pl">统计分析五</li>
        </ul>

js代码

$(function(){
    // index();
    $(".index_nav ul li").each(function(index){
        $(this).click(function(){
            $(this).addClass("nav_active").siblings().removeClass("nav_active");  //,当前按钮变色,去掉 上一个点击按钮变色
//siblings() 方法返回被选元素的所有同级元素。
            $(".index_tabs .inner").eq(index).fadeIn().siblings("div").stop().hide(); //隐藏
//eq() 方法返回带有被选元素的指定索引号的元素。fadeIn() 方法逐渐改变被选元素的不透明度，从隐藏到可见（褪色效果）。注释：隐藏的元素不会被完全显示（不再影响页面的布局）

            if(index==1){
                yingXiao();
            }else if(index==2){
                shouRu();
            }else if(index==3){
                AnQuan();
            }else if(index==4){
                user();
            }else if(index==5){
                manage();
            }
        })
    });
    $(".tabs ul li").each(function(index){
       $(this).click(function(){
           $(".tabs ul li div .div").removeClass("tabs_active");
           $(this).find("div .div").addClass("tabs_active");
           $(".tabs_map>div").eq(index).fadeIn().siblings("div").stop().hide();
       })
   });
    $(".middle_top_bot ul li").each(function(){
        $(this).click(function(){
            $(".middle_top_bot ul li").removeClass("middle_top_bot_active");
            $(this).addClass("middle_top_bot_active");
        })
    });

});