jq实现tab点击功能

css:

        .nav{
            margin: 20px 0;
            display: flex;
            justify-content: space-around;
        }
        .nav>span{
            padding: 10px 0;
        }
        .nav .act_nav{
            border-bottom:1px solid #f97952;
            color: #f97952; 
        }

 

html:

<div class="nav">
        <span class="act_nav">全部</span>
        <span>代理</span>
        <span>待激活用户</span>
    </div>

 

js:

$('.nav>span').on('click',function () {
        $('.nav>span').removeClass('act_nav')
        $(this).addClass('act_nav')
    })