Question

好吧，所以这个问题之前肯定已被问过，我实际上能够在jquery中找到我的问题的答案，当我试图实现答案时，我无法让它工作。我宁愿在java脚本中这样做.....

我正在读取一个由DB中的逗号分隔的文本字符串，我想将它们转换为多选框中的选定选项。

我一直在做的就是试图让浏览器选择一个与硬编码字符串相匹配的选项，当我点击一个按钮但我甚至无法让它工作。但我想，既然我在问这个问题，我不妨写出整个脚本，这样你就可以看到所有这些并且可能会遇到我可以期待的任何其他问题...最后，我怎么能让它运行起来在页面的负载？对不起，如果这是多余的和基本的，但我对JS很新，并找到问题的现有答案没什么帮助。提前谢谢。

修改

所以，我发现如果我按照Asad的答案使用'select.options [i] .value = true'（布尔代替字符串），我可以让分配工作。但是，我正在使用Harvest的Chosen多选控制：http://harvesthq.github.com/chosen/

当我将所选类分配给控件时，脚本将不起作用。我知道控件是在调用JQuery，这是为什么？有可能让它发挥作用吗？再次感谢。

function selectitems() {
  var select = document.getElementById("multiselectid");
  var array = stringFromDB.split(",");

  for(count=0, count<array.length, count++) {
    for(i=0; i<select.options.length; i++) {
      if(select.options[i].value == array[count]) {
        select.options[i].selected="selected";
      }
    }
  }
}

Answer 1

您的第一个for循环有两个语法错误。尝试在浏览器中查看控制台

for(count=0, count<array.length, count++) {

应该是：

for(count=0; count<array.length; count++) {

注意“，”更改为“;”在count=0和count<array.length部分之后。

此外，您可能希望使用for(var count=0和for(var i=0，以便count和i变量不会全局声明。

Answer 2

好的，所以我将在我的回答中尝试解决你问题的所有部分。

正如Ian所提到的，for声明中存在语法错误。

第二个想法我会给出代码然后做解释。为了清楚起见，我已经包含了整个HTML文档：

<!DOCTYPE html>
<html lang=en-CA>
    <meta charset=utf-8>
    <title>JavaScript in multi-select</title>

    <script>

    function selectItems(stringFromDB) {
        'use strict';

        var select = document.getElementById("multiselectid"),
            stringArray = stringFromDB.split(","),
            count = 0,
            i;

        for(count = 0; count < stringArray.length; count += 1) {
            for(i = 0; i < select.options.length; i += 1) {
                if(select.options[i].value === stringArray[count]) {
                    select.options[i].selected = true;
                }
            }
        }
    }

    window.addEventListener('load', function() {
        'use strict';

        // The "string from DB" would be the parameter here
        selectItems( 'hockey,volleyball,football');
    }, false);

    </script>

    <body>
        <div>
            <select id='multiselectid' multiple>
                <option value="hockey">Hockey</option>
                <option value="golf">Golf</option>
                <option value="volleyball">Volleyball</option>
                <option value="football">Football</option>
            </select>
        </div>

现在进行解释。

我没有在body元素上使用传统的onload事件属性来在页面加载时运行脚本（正如您所希望的那样），而是使用事件load附加了一个事件处理程序window DOM元素。事件处理程序更有用，因为它们有助于将JavaScript与HTML分开（以及许多其他原因）。您可以在此处详细了解事件处理程序：https://developer.mozilla.org/en-US/docs/DOM/element.addEventListener
在函数selectItems()中，我将所有变量放在一个声明中以保持代码清洁。

<击> 3。为了避免数组的潜在问题，我调用了变量stringArray。 array是JavaScript中的保留字，可能会导致某些浏览器出现问题，但我并不完全确定哪些浏览器（如果有的话）。
总是，总是使用===代替==。这样你就可以确定比较是严格和正确的（即所比较的东西都是相同的类型，在这种情况下：字符串）。
最好使用'use strict;'强制在严格模式下处理JavaScript函数。这样，如果浏览器检测到不允许的内容，它将停止（并抛出异常），从而允许您编写更好的JavaScript代码。

希望这有帮助，如果您仍然感到困惑，请随时提出更多问题！

如何使用javascript在multiselect中设置所选选项

2 个答案: