Jquery switchClass 不工作

Question

我在菜单中使用 jquery slideToggle()。

我有一个问题。

switchClass() 为什么不起作用？我需要使用它的功能来更改 :after 和 :before 内容

$(".left > ul > li>a").click(function () {
    $(this).next(".sub").slideToggle(); 
    $(".hov").switchClass("hov", "down", 1000);
    $(".down").switchClass("down", "hov", 1000);

});

<div class="left">
<ul>
    <li><a href="#">Home</a></li>
    <li class="opened">
        <a class="hov">User</a>
        <ul class="sub">
            <li><a href="#">add</a></li>
            <li><a href="#">search</a></li>
            <li><a href="#">delete</a></li>
        </ul>       
    </li>
    <li>
        <a class="down">Record</a>
        <ul class="sub">
            <li><a href="#">add</a></li>
            <li><a href="#">search</a></li>
            <li><a href="#">delete</a></li>
        </ul>
    </li>
    <li><a href="#">Test</a></li>
</ul>

要点 css:

.left ul li a:after {
    font-family: FontAwesome;
    float: right;
    margin-right: 8px;
}
.left ul li a.hov:after {
    content:"\f105";
}
.left ul li a.down:after {
    content:"\f107";
}

Answer 1

这里的例子可能对你有帮助fiddle

$(".left > ul > li > a").click(function () {
    $(this).siblings(".sub").slideToggle();
    if( $(this).hasClass("hov") || $(this).hasClass("down") ) {
        $(this).toggleClass("hov down");
     }
});

Jquery switchClass 不工作

Jquery switchClass not work

jquery