原生js jq选项卡

标签：gw index regardc 选项卡 jq js box tit2 display

html

    <div class="regardc">         <div class="gw_b_box2">             <div class="gw_box_tit2 on">                 <span class="sh3mabouth7">Staff</span>             </div>             <div class="gw_box_tit2">                 <span class="sh3mabouth7">Faculty</span>             </div>         </div>         <div class="regardc_list">             <div class="regardc_item1 on">                 <li class="regardc_li">                     1                 </li>             </div>             <div class="regardc_item1">                 <li class="regardc_li">                     2                 </li>             </div>         </div>     </div>   css     <style>         .gw_b_box2 {             display: flex;             justify-content: center;             align-items: center;         }
        .gw_box_tit2 {             width: 120px;             text-align: center;             margin-right: 30px;             border-radius: 5px;         }
        .gw_box_tit2.on {             background: #8d2893;             color: #fff;         }
        .gw_box_tit2:hover {             cursor: pointer;         }
        .regardc_item1 {             display: none;         }
        .regardc_item1.on {             display: block;         }
        .regardc_li {             width: 24%;             margin-top: 10px;             display: inline-block;         }     </style>   js       <script type="text/javascript" src="js/jquery-3.3.1.min.js"></script>     <script>         $(".regardc .gw_box_tit2").click(function () {             var index = $(this).index();             $(this).parent().siblings().children().eq(index).addClass("on").siblings().removeClass("on");         });
        $('.regardc .gw_box_tit2').click(function () {             var index = $(this).index();             $('.regardc .gw_box_tit2').removeClass('on').eq(index).addClass('on');         })     </script>  

标签：gw,index,regardc,选项卡,jq,js,box,tit2,display
From： https://www.cnblogs.com/yangcaicai/p/16719488.html