将构造的类名传递给JQuery

时间:2016-02-18 14:24:34

标签: javascript jquery arrays class

我使用数组附加到基类名称,以便我可以遍历不同的类。

第一位工作正常。计算数组,只要排除最后两行代码,我就可以在控制台中获得所有需要的类名。

但是,一旦我在循环中添加最后两行并尝试添加构造的类名以获取每个类的不同文本值,我会收到以下错误:

未捕获错误:语法错误,无法识别的表达式:' .moduleStatusDIS'

它在第一次迭代中停止通过数组。代码如下。

function setModuleStatusColour() {

var array = ["DIS", "DDG", "CDX", "DKM", "DBV", "DBB", "DGK", "DAM", "LOG", "DUS", "DCL", "DRI"];
var arrayLength = array.length;
console.log(arrayLength);
for (x=0; x < arrayLength; x++){

    var className = "'"+'.moduleStatus'+array[x]+"'";
    console.log(className);
    var statusValue = $(className).text();
    console.log(statusValue);
}

}

我也尝试过使用eval()(尽管我知道它被弃用了,绝望对我来说更好)见下文。与上面的代码结果相同。

function setModuleStatusColour() {

var array = ["DIS", "DDG", "CDX", "DKM", "DBV", "DBB", "DGK", "DAM", "LOG", "DUS", "DCL", "DRI"];
var arrayLength = array.length;
console.log(arrayLength);
for (x=0; x < arrayLength; x++){

    var className = "'"+'.moduleStatus'+array[x]+"'";
    console.log(className);
    eval('var statusValue = $(className).text()');
    console.log(statusValue);       
}

}

甚至尝试将var className强制转换为String,但也不适用于我。

如果我逐类写出并且不使用数组来构造名称,那么它可以正常工作但我试图保持代码简短并使其易于添加。所以它已经成为一个原则问题:)

非常感谢任何帮助!

3 个答案:

答案 0 :(得分:5)

这一行:

var className = "'"+'.moduleStatus'+array[x]+"'";

应该只是

var className = ".moduleStatus" + array[x];

给你一个像

这样的选择器
var statusValue = $(".moduleStatusDIS").text();

选择器只是字符串,不需要用单引号括起来。

答案 1 :(得分:3)

应该很简单,只需:

function setModuleStatusColour() {
    var array = ["DIS", "DDG", "CDX", "DKM", "DBV", "DBB", "DGK", "DAM", "LOG", "DUS", "DCL", "DRI"];
    var arrayLength = array.length;
    console.log(arrayLength);
    for (x=0; x < arrayLength; x++){
        var statusValue = $('.moduleStatus'+array[x]).text();
        console.log(statusValue);
    }

答案 2 :(得分:1)

选择符符合:$( - string-)其中-string-应该是以点开头的类的名称(&#34; .className&#34;),或者像$这样的元素的名称( &#34; div&#34;)(但这将选择所有div元素!),或者前面带#符号的元素的id,如$(&#34; #sendButton&#34;)...之所以如此.className和#sendButton被引号括起来,它们是引用赋予元素的属性的字符串,如下所示:

<div class="className">...</div> --> $(".className")
<div id="sendButton">..<div> --> $("#sendButton")
<div>...</div> --> $("div")