向 selected.js

如何解决向 selected.js

我在从 <select> 数组向 chart.js <option> 添加选项时遇到了一些问题。我一直使用相同的粗略程序，所以我不确定为什么它现在让我失败......

我在做什么：

0. 我有几个 <select> 看起来或多或少是这样的：

<select id='soilname' data-placeholder='Type here' multiple class='chosen-select'>
    <option value=''></option>
</select>

1. 一系列的步骤，让我得到一个 <option> 的数组。此数组称为 optnames。
2. 我遍历数组，将其添加到多个 <select> 中：

for(var i=0; i < optnames.length; i++)
{
    document.getElementById("soilname").appendChild(optnames[i]);
    document.getElementById("soilyearname").appendChild(optnames[i]);
    document.getElementById("albedoname").appendChild(optnames[i]);
    document.getElementById("dcname").appendChild(optnames[i]);
    document.getElementById("acname").appendChild(optnames[i]);
}

3. 一段距离后，我激活了 selected.js：

jQuery(".chosen-select").chosen({
    width: "400px"
});

我确保在 <script> 标签中包含所有相关文件和插件。我还console.log()编辑了 optnames 以确保数组符合我的预期。关于这个主题的其他几个页面提出了很好的解决方案 - 没有工作。关于错误可能是什么的任何想法？

编辑：一些截图：

1. 搜索框。它们的大小正确为 400 像素。

   

2. 单击其中一个文本框。我在这里手动添加了一个虚拟选项。

   

解决方法

我设法弄清楚出了什么问题。我正在混合 jQuery 和 JavaScript（这是我经常做的坏习惯）。我现在编写的代码都是 jQuery：

for(var i=0; i < mynames.length; i++)
{
    $('#soilname').append($("<option>"+mynames[i]+"</option>"));
    $('#soilyearname').append($("<option>"+mynames[i]+"</option>"));
    $('#albedoname').append($("<option>"+mynames[i]+"</option>"));
    $('#dcname').append($("<option>"+mynames[i]+"</option>"));
    $('#acname').append($("<option>"+mynames[i]+"</option>"));
}

（mynames 是我最初构建 optnames 的字符串数组。）这完全按照我的需要添加了所有选项。我希望其他人会觉得这很有用。