Select2 正在复制我的下拉列表答案

【问题标题】：Select2 is duplicating my dropdown listSelect2 正在复制我的下拉列表
【发布时间】：2015-10-25 23:47:07
【问题描述】：

Select2 正在复制我的下拉列表，所以我既有原始选择列表，也有 select2 选择框，我无法在我的项目之外重新创建它，所以它可能是一个导入，以前有没有人经历过类似的事情或知道什么进口可能导致它？我能找到的唯一信息是关于我没有的 jquery growfield。谢谢！

HTML

<p class="form-control input-lg"><label for="industry">Industry</label>:
    <select class="industry" id="industry" name="industry">
        <option value="Select" selected="selected"></option>
        {% for industry in industries %}
            <option value="{{ industry }}">{{ industry }}</option>
        {% endfor %}
    </select>
</p>

JQuery

 <script type="text/javascript">
     $(document).ready(function () {
     $("#industry").select2();
     $
 });

【问题讨论】：

您在同一页面上是否有多个具有该 ID 的 <select> 元素？通常，这里的原因是 Select2 被克隆，或者实际上有多个副本。你可能想检查你的 JS 控制台，因为它可能有一些关于为什么 Select2 没有隐藏原始文件的信息。

标签： jquery html twitter-bootstrap flask jquery-select2

【解决方案1】：

我发现问题是由于我在原始列表元素上使用 css 引起的。
Select2 通过将 select2-hidden-accessible 类应用于我编写的实际选择字段来工作。

该类具有 CSS，除其他外，它会将原始选择字段缩小到 1px 宽度，因此它不可见。
然后它根据原始选择元素的内容呈现自己的span 类，这些类具有select2 功能。

.form_inputs select{} 上的 CSS 将这种缩小覆盖到 1px width。

【讨论】：

那么您对代码进行了哪些更改以使其按您的意愿工作？

【解决方案2】：

它很旧但总是有用的！

我忘记为 select2 导入 CSS...这就是为什么它不起作用并显示了两次选择。

希望对你有帮助！

【讨论】：