Question

Select2是一个整齐的下拉菜单，结合了输入和自动填充功能。如果我不包含<option value="" selected="selected" style="display:none;"></option>，则默认情况下始终会选择第一个选项，并且占位符不会显示。

有没有比这更好的解决方案？

以下是我在HTML中所做的事情：

<select id="my-dropdown">
  <option value="" selected="selected" style="display:none;"></option>
  <option value="a">A</option>
  <option value="b">B</option>
  <option value="c">C</option>
</select>

在Javascript文件中：

$('#my-dropdown').select2({
  placeholder: 'Choose One'
});

Answer 1

在你的js代码之后添加以下内容：

$('#my-dropdown').val('').trigger('change');

或更简单地将您的js代码更改为：

$('#my-dropdown').select2({
  placeholder: 'Choose One'
}).val('').trigger('change');

Fiddle

Answer 2

data-placeholder属性适合我，这是一个例子：

<select class="form-control" data-placeholder="Choose One">
    <option value=""></option>
    ...

在Select2下拉列表中显示占位符

2 个答案: