removeClass 按钮点击添加class效果

案例一:

html代码:

<ul class="pubClass" id="pubClass">
    <li class="active">
        <a href="#tag1">aa</a>
    </li>
    <li>
        <a href="#tag2">bb</a>
    </li>
    <li>
        <a href="#tag3">cc</a>
    </li>
/ul>

jquery代码:

<script>
    $(function(){
        $("#pubClass li").click(function(){
            $("#pubClass li").eq($(this).index()).addClass("active").siblings().removeClass("active");
         })
    })
</script>

 

 

案例二:

html代码:

<div class="game">
    <span class="active">全部</span>
    <span>游戏1</span>
    <span>游戏2</span>
</div>
<div class="game">
    <span class="active">全部</span>
    <span>视频1</span>
    <span>视频2</span>
</div>

jquery代码:

<script type="text/javascript">
    $(function () {
        $('.game span').click(function () {
            $(this).addClass('active').siblings().removeClass('active').end();
        });
    }); 
</script>
posted @ 2016-12-21 11:56  申文哲  阅读(2278)  评论(0编辑  收藏  举报