Question

我正在使用http://ivaynberg.github.io/select2/

中的Select2

现在我正在初始化这样的下拉列表：

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

 $('.form_control').select2({
     minimumResultsForSearch: -1
 });

  });
 </script>

问题是，我有一个页面，我动态生成基于订单的下拉菜单，因此我将在同一页面上有多个同一个类的下拉列表和表单，如下所示：

<select id="order_status" class="form-control" name="order_status">

<option value="">Option 1</option>
<option value="">Option 2</option>

</select>

当我这样做时，第一个下拉列表初始化正常，但同一页面上的所有其他内容都没有。如何让它初始化所有form_control下拉列表？

JSFiddle：http://jsfiddle.net/hryoy8rc/1/

Answer 1

请尝试下面的代码......

$('.form_control').each(function(index, element) {
    $(this).select2({
        minimumResultsForSearch: -1
    });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select id="order_status" class="form-control" name="order_status">

<option value="">Option 1</option>
<option value="">Option 2</option>

</select>

来自维也纳的问候

Answer 2

我最终给每个下拉列表一个动态生成的ID，如drop_003，然后在体内初始化它，如下所示：

<script>
$('#drop_003').select2({
minimumResultsForSearch: -1
});
</script>

Answer 3

它是当前版本的错误，我在使用4.0.0时遇到相同的问题，它将解决您的问题： https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.0/js/select2.min.js

Answer 4

我正在使用Select2 4.0.2版本，此代码段对我有用。它将页面中的所有选择元素初始化为Select2。

$(document).ready(function () {
   $('select').select2();
});

如何在具有相同类的页面上初始化所有Select2下拉列表

4 个答案: