javascript - 将变量值而不是其名称作为类传递

Question

我有一个保存列宽度类值的数组

var colWidth = ["col-sm-0", "col-sm-1", "col-sm-2", "col-sm-3", "col-sm-4", "col-sm-5", "col-sm-6", "col-sm-7", "col-sm-8", "col-sm-9", "col-sm-10", "col-sm-11", "col-sm-12"]

许多其他对象在任何给定时间可能会或可能不会出现在页面上，在它们自己的 div 内。这些 div 的列宽各不相同。

我有一个函数，每当页面宽度发生任何变化时都会运行该函数。它被设置为从整个舞台宽度中减去页面上其他所有内容的宽度，然后将该值应用于主 div。

function widthPlotter() {
    oldStageWidth = stageWidth;
    stageWidth = (12 - (panelWidth + menuWidth));
    newClass = colWidth[stageWidth];
    oldClass = colWidth[oldStageWidth];

    $(activeDiv).toggleClass('oldClass newClass')
}

我设置了一个 toggleClass，因为我希望主列能够在其他任何内容发生变化时从当前宽度平滑地进行动画填充以填充屏幕。

我的问题是这样的:当该代码执行时，它实际上将“oldClass”或“newClass”应用于 div，而不是它们的值(例如 col-sm-7)。

Answer 1

it literally applies 'oldClass' or 'newClass' to the div, rather than their values (e.g. col-sm-7).

当然可以，您已经给了它一个文字字符串:'oldClass newClass'。引号使其成为字符串，而不是对变量的引用。

相反:

$(activeDiv).toggleClass(oldClass).toggleClass(newClass);

或

$(activeDiv).toggleClass(oldClass + " " + newClass);

...但第一个可能更清晰且同样高效。