jQuery函数问题。添加过多的类

Question

我对此功能有疑问。问题出在TD索引2上，如下所述。每次迭代中的HTML都是正确的，但是我不知道为什么要添加额外的类？该类应与HTML相同。

第一次迭代：HTML：A类别：A

第二次迭代：HTML：B类别：A B

第三次迭代：HTML：C类别：A B C

第4次迭代：HTML：A类别：A B C

第5次迭代：HTML：B类别：A B C

第六次迭代：HTML：C类别：A B C

function formatTable(){
    count=1;
    phase="";
    var phase13 = $('input[name=voltage]:checked').attr("phase");
    var cClass =  $('input[name=voltage]:checked').attr("cClass");

    $tableID.find('tbody tr').each(function(idx){
        $(this).children().eq(1).html(count++);

        switch (phase13){
            case "1":
                if ((count) % 4 == 0) {
                    phase = "B";
                } else {
                    phase = "A";
                }
                break;
            case "3":
            default:
                if ((count+1) % 3 == 0){
                    phase="A";
                } else {
                    if (count % 3 == 0){
                        phase="C";
                    } else {
                        phase="B";
                    }
                }
                break;
        }

        $(this).children().eq(2).html(phase).addClass(cClass).addClass(phase);  // This sets HTML to A, B or C, but after the 3rd iteration adds Class A, B and C.
        $(this).children().eq(3).html(count++);
    });
}

Answer 1

您的问题是您永远不会删除旧的phase类，因此新的类仅被添加到列表中。在添加新的阶段类之前添加removeClass('A B C')：

$(this).children().eq(2).html(phase).addClass(cClass).removeClass('A B C').addClass(phase);

通过使用removeClass('A B C')，您不必担心弄清楚元素上当前设置了哪个相位类，因为这将全部删除。