Question

我遇到了两个问题：第一个是javascript没有在菜单中添加选项，第二个是我的for循环结束时出现“意外或无效令牌”错误。

更新：令牌错误是一个奇怪的字符。我删除了引起问题的行，然后重新输入它，现在不再出现错误，但是我的脚本仍然没有添加选项。

我已经阅读了有关在选择菜单中添加选项的信息，但是我在那找到的答案对我没有用。我应该指出，这是Joomla网站（v3.8）的一部分，因为这可能会导致某些意外行为。

我有一个功能，该功能应该根据字符串“ id”选择一个特定的选择菜单，清除其内容，然后使用“ options”数组的元素重新填充它。

function resetSelectMenu(id, options){
    // Selects the correct menu, enables it, and removes all of its options. 
    var selectMenu = jQuery('#sel-' + id);
    selectMenu.prop('disabled', false);
    selectMenu.empty();        
    // Makes an option element and sets its text and value.
    var el = document.createElement("option");
    el.text = 'blah';
    el.value = 'blah';
    // Does not succeed in adding an option to menu.
    selectMenu.add(el);

    // I declared loop variables here to make sure there are no re-declaration issues.
    var i;
    var opt;
    // The loop is entered and the array is iterated through.
    for(i = 0; i < options.length; i++){
        opt = options[i];
        el = document.createElement("option");
        el.text = opt;
        el.value = i + 1;
        // Does not succeed in adding an option to menu.
        selectMenu.add(el);
    }

}

该函数确实以正确的菜单为目标并清除了其内容，但未添加“ blah”选项或“ options”数组中的任何内容。我尝试使用“ appendChild（el）”代替“ add”，但出现“ appendChild（）不是函数”形式的错误。我做了很多控制台日志来确定代码的所有部分都按预期工作，除了“ selectMenu.add（el）;”

Answer 1

所以这只是一个菜鸟错误。我看上去有点难受，发现了this related question，Matt的最高答案告诉我，我需要使用append(el)而不是add(el)。我查看了文档，add方法仅影响jQuery对象，但实际上根本不影响DOM，而append则影响DOM。如果要使用add，则需要明确告诉jQuery对象刷新DOM。

使用selectMenu.empty()代替selectMenu.find('option').remove()之类的东西，我还是有问题，但目前还没有引起任何错误。由于我的select元素仅包含option元素，因此我觉得这两个命令将是相同的，但另一方面，后者也许更好，因为它允许稍后添加不同种类的元素。

使用JavaScript将选项添加到选择菜单时出错

1 个答案: