jQuery .addClass没有在$(this)上执行

Dav*_*ore 0 html javascript jquery addclass

当用户单击所选类更改为单击的项时,我试图更改列表项.我有这个代码:

$(function() {
    $("a.product-page li").click(function(){
        $(this).parent("a").addClass("selected-page");
        $("#options a.selected-page").removeClass("selected-page");
    });
});
Run Code Online (Sandbox Code Playgroud)

但是,removeClass可以工作,但addClass却没有.

这是网站.

HTML:

<ul id="options">
    <a href="#summary" id="summary" class="product-page selected-page"><span></span><li>Summary</li></a>
    <a href="#specs" id="specs" class="product-page"><span></span><li>Specs</li></a>
    <a href="#media" id="media" class="product-page"><span></span><li>Media</li></a>
    <a href="#reviews" id="review" class="product-page"><span></span><li>Reviews</li></a>
</ul>
Run Code Online (Sandbox Code Playgroud)

CSS:

ul#options {
    margin-left:0px;
}

ul#options li{
    list-style:none;
    padding: 10px 20px;
    background: #CCC;
    border-top: 1px #999 solid;
    border-left: 1px #999 solid;
    border-right: 1px #999 solid;
}

ul#options a{
    display:block;
    border:none !important;
}

ul#options a.selected-page span{
    position:absolute;
    width:0px;
    height:0px;
    border-width:10px;
    border-color:transparent #999999 transparent transparent;
    border-style:solid;
    margin-left:270px;
    margin-top:11px;
}

ul#options a:last-child li {
    border-bottom:1px #999 solid;
}
Run Code Online (Sandbox Code Playgroud)

I H*_*azy 7

这是因为你立即删除了这门课程.翻转这两行,它会工作.

$(function() {
    $("a.product-page li").click(function(){
        $("#options a.selected-page").removeClass("selected-page");
        $(this).parent("a").addClass("selected-page");
    });
});
Run Code Online (Sandbox Code Playgroud)

如上面的评论中所述,您的HTML也非常不正确.这需要修复.