Select2 正在复制我的下拉列表
Select2 is duplicating my dropdown list
Select2 正在复制我的下拉列表,所以我有原始的 select 列表和 select2 select 框,我无法在我的项目之外重新创建它所以它可能是进口的,有没有人以前经历过类似的事情或者知道是什么进口造成的?我能找到的唯一信息是我没有的 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();
$
});
我发现问题是由我在原始列表元素上使用 css 引起的。
Select2
通过将 class select2-hidden-accessible
应用于我编写的实际 select 字段来工作。
class 有 CSS,除其他外,将原始 select 字段缩小到 1px 宽度,因此它不可见。
然后它根据原始 select 元素的内容呈现自己的 span
class 具有 select2
功能的元素。
CSS 在 .form_inputs select{}
上覆盖了这个缩小到 1px width
。
它很旧但总是有用!
我忘记为 select2 导入 CSS... 这就是它不起作用并显示 select 两次的原因。
希望对您有所帮助!
Select2 正在复制我的下拉列表,所以我有原始的 select 列表和 select2 select 框,我无法在我的项目之外重新创建它所以它可能是进口的,有没有人以前经历过类似的事情或者知道是什么进口造成的?我能找到的唯一信息是我没有的 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();
$
});
我发现问题是由我在原始列表元素上使用 css 引起的。
Select2
通过将 class select2-hidden-accessible
应用于我编写的实际 select 字段来工作。
class 有 CSS,除其他外,将原始 select 字段缩小到 1px 宽度,因此它不可见。
然后它根据原始 select 元素的内容呈现自己的 span
class 具有 select2
功能的元素。
CSS 在 .form_inputs select{}
上覆盖了这个缩小到 1px width
。
它很旧但总是有用!
我忘记为 select2 导入 CSS... 这就是它不起作用并显示 select 两次的原因。
希望对您有所帮助!