javascript - jQuery - 添加和删除类

Question

我正在尝试使它有一个默认选项卡，当单击另一个选项卡时，它会将类从该选项卡上移到被单击的选项卡上。

这是我拥有的 HTML：

<div id="rightWrap">
    <div id="headStep"><span class="titleSub">Workers</span></div>
    <center>
    <br>
    <a href="../about/?s=architect"><table class="highlight">
    </table></a>
    <br>
    <a href="../about/?s=broker"><table class="">
    </table></a>
    <br>
    <a href="../about/?s=operator"><table class="">
    </table></a>
    <br>
    <a href="../about/?s=consultant"><table class="">
    </table></a>
    </center>
</div>

和 JavaScript：

$(document).ready(function() {
    $('#rightWrap a table').click(function(){
    $(this).addClass('highlight').siblings().removeClass('highlight');
});
});

Answer 1

你的表不是兄弟姐妹。

$(document).ready(function() {
    $('#rightWrap a table').click(function(){
        var $this = $(this);
        $this.parent().siblings('a').find('table').removeClass('highlight');
        $this.addClass('highlight');     
    });
});

请注意，如果页面的文档类型不是 HTML5，则使用<a>元素包装表格会使您的文档无效。

Answer 2

我认为您可以将其简化为；

$(document).ready(function() {
    $('#rightWrap a table').click(function(){
        $('#rightWrap').find('.highlight').removeClass('highlight');
        $(this).addClass('highlight');     
    });
});

您的 HTML 还需要一些认真的工作。为什么是空桌子？