Question

我似乎无法让这个plugin正常工作。文档有点令人困惑。

这是我正在处理的网站“http://smartbin.launchlabs.asia/”，这是我的代码的jsfiddle jsfiddle.net/7Ljq2/。

<select multiple id = "zipcode" style = "height:auto;">
<optgroup label="Brighton Council">
    <option value = "BC">Brighton 3186</option>
    <option value = "BC">Brighton East 3187</option>
    <option value = "BC">East Brighton 3187</option>
    <option value = "BC">East Hampton 3188</option>
    <option value = "BC">Hampton 3188</option>
    <option value = "BC">Hampton East 3188</option>
    <option value = "BC">Highett 3190</option>
    <option value = "BC">Sandringham 3191</option>
    <option value = "BC">Beaumaris 3193</option>
    <option value = "BC">Cheltenham 3192</option>
    <option value = "BC">Black Rock 3193</option>
    <option value = "BC">Mentone 3194</option>
</optgroup>
</select>

这是在头标记

内

      <link href="/select2.css" rel="stylesheet"/>
  <script src="/select2.js"></script>

  <script>
        $(document).ready(function() {

          $("#zipcode").select2(); 

        });
  </script>

我可能只是错过了一些非常明显的东西。我真的需要帮助。感谢。

Answer 1

我已经用我看到的问题更新了你的jsfiddle示例。

工作示例：http://jsfiddle.net/7Ljq2/1/

一些事情：

您必须包含外部资源（JS，CSS）。
你必须包含jQuery，因为它是你正在使用的插件所必需的。
JS代码应该运行onDomReady而不是onLoad。
选择不需要style或multiple属性。

大多数选项都在jsfiddle界面的左侧菜单中配置。

<强> HTML ：

<select id="zipcode">
    <option value = "BC">Brighton 3186</option>
    <option value = "BC">Brighton East 3187</option>
    <option value = "BC">East Brighton 3187</option>
    <option value = "BC">East Hampton 3188</option>
    <option value = "BC">Hampton 3188</option>
    <option value = "BC">Hampton East 3188</option>
    <option value = "BC">Highett 3190</option>
    <option value = "BC">Sandringham 3191</option>
    <option value = "BC">Beaumaris 3193</option>
    <option value = "BC">Cheltenham 3192</option>
    <option value = "BC">Black Rock 3193</option>
    <option value = "BC">Mentone 3194</option>
</select>

<强> JS ：

$("#zipcode").select2();

Answer 2

您的site有一些错误：

  jQuery.document).ready(function() {
      alert("hi");
    jQuery("#zipcode").select2();

    });

没有方括号(：

您必须使用：jQuery(document).ready(function() {

Answer 3

http://harvesthq.github.io/chosen/

这里你可以得到许多类型的选择框。尝试并检查你的代码。

我不能让多个选择框工作

3 个答案: