javascript - 从下拉列表中选择的多个 JavaScript 似乎无法共存

Question

我正在构建一个动态创建的字符串，其中正在查看多个下拉列表的值等。

HTML:    <div id="codeSnip">WHERE ... </div>

然后单击按钮，调用 JavaScript 函数:

function applyFilters(val)  {

    var x = document.getElementById("codeSnip");
    var newDiv = document.createElement("div"); 
    var newContent = document.createTextNode("Hi there and greetings!"); 

    //var column = []; 
    //$('[id^=selectNumber] :selected').each(function(i, selected){ 
    //column[i] = $(selected).text(); 

    var conditions = []; 
    $('[id^=condition] :selected').each(function(z, selected){ 
    conditions[z] = $(selected).text();      


    //newContent = document.createTextNode(column[i]);  
    //x.appendChild(newContent); //add the text node to the newly created div. 
    newContent = document.createTextNode(conditions[z]);  
    x.appendChild(newContent); 

    newContent =  document.createTextNode(" AND ");  
    x.appendChild(newContent); 

});

我似乎无法同时存在两个下拉菜单，而我的原始列创建者不会出现错误，该错误在运行时实际上与警报和 console.log 没有任何关系，因为警报和 console.log 没有报告任何内容。

Error:   Uncaught SyntaxError: missing ) after argument list  

-(用于动态创建下拉列表的不同函数)，但是一旦我注释掉名为 selectNumber 的 2 个下拉列表中的 一个 或 condition - 然后就可以了。不知道为什么这两个都不能使用。

更新:我确实做了建议的更改，但在创建函数中出现了非常相似的错误。

未捕获的语法错误:意外的标记}

这是哪个函数:

function columnCreator(columnArray, selectId) {
    var dropdown = document.getElementById(selectId);
    for (var i = 0; i < columnArray.length; ++i) {
        // Append the element to the end of Array list
        dropdown[dropdown.length] = new Option(columnArray[i], columnArray[i]);
    }

}

Answer 1

存在该错误是因为您的参数列表从未关闭:

$('[id^=selectNumber] :selected').each(callback);

回调后，需要关闭该语句。所以你会得到这样的东西:

function applyFilters(val)  {

    var x = document.getElementById("codeSnip");
    var newDiv = document.createElement("div"); 
    var newContent = document.createTextNode("Hi there and greetings!"); 

    var column = []; 
    $('[id^=selectNumber] :selected').each(function(i, selected){ 
        column[i] = $(selected).text(); 

        newContent = document.createTextNode(column[i]);  
        x.appendChild(newContent); //add the text node to the newly created div. 
    });

    var conditions = []; 
    $('[id^=condition] :selected').each(function(z, selected){ 
        conditions[z] = $(selected).text();

        newContent = document.createTextNode(conditions[z]);  
        x.appendChild(newContent);  
    }); 

    newContent =  document.createTextNode(" AND ");  
    x.appendChild(newContent); 

}