javascript - if语句无法正常运行

折叠或展开的折叠项（JSFiddle）时，箭头似乎无法正确显示

码：

$('body').on("click", "span#expandcollapse", function ()
{
    $(this).text(function(i, currentText)
    {
        return currentText === 'Expand All' ? 'Collapse All' : 'Expand All';
    });

    if($(this).text() === 'Expand All')
    {
        //Currently collapsed
        if($('.projectscontainer').find("div.destarrow").hasClass('arrow-right'))
            $('.projectscontainer').find('div.destarrow').toggleClass("arrow-right arrow-down");
        $(".projectscontainer").find(".srcprojects").toggle(false);
    }
    else
    {
        //Currently expanded
        $(".projectscontainer").find(".srcprojects").toggle(true);
        if($('.projectscontainer').find("div.destarrow").hasClass('arrow-down'))
            $('.projectscontainer').find('div.destarrow').toggleClass("arrow-down arrow-right");
    }
});

该行无法正常工作：

    if($('.projectscontainer').find("div.destarrow").hasClass('arrow-down'))
        $('.projectscontainer').find('div.destarrow').toggleClass("arrow-down arrow-right");

当我单击全部展开时，项目应展开（工作），并且箭头应指向下方（不工作）。当我单击全部折叠时，应发生相反的情况。例如，如果我单击绿色项目之一，然后单击全部展开，则所单击项目的箭头方向不同。

我究竟做错了什么？如果清单很大，这里是否需要解决性能问题？谢谢！

最佳答案

这是一个有效的JSFiddle。

您的问题实际上是由于以下代码

$('.projectscontainer').find("div.destarrow").hasClass('arrow-right')

在此特定情况下始终返回true，因为$（'。projectscontainer'）。find（“ div.destarrow”）返回包含一些带有向右箭头的箭头和一些带有向下箭头类的箭头的箭头元素数组，因此始终返回true。我将代码重构为使用过滤器。