CSS select2 占位符显示空选项
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/19452449/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
select2 placeholder showing empty option
提问by Mariana Hernandez
too add a placeholder in select2 i have to add an empty option tag in the code like this
也在 select2 中添加一个占位符我必须在这样的代码中添加一个空的选项标签
<select id="e2" name="rol_id" >
<option><option>
{foreach from=$data.roles item=rol}
<option value={$rol.rol_id}>{$rol.rol_nombre}</option>
{/foreach}
</select>
but when i do that i get this option empty that is selectable
但是当我这样做时，我将这个选项设为空，这是可选的
how can i not show that option but still the placeholder?
我怎么能不显示该选项但仍然是占位符？
Thanks!
谢谢！
回答by Max
You have a syntax error on 2nd line.
您在第二行有语法错误。
<option></option>
回答by devwebapp
It's a late answer, but it can help someone.
这是一个迟到的答案，但它可以帮助某人。
I have modal with a select2 input.
我有一个带有 select2 输入的模态。
We need to add <option></option>for the placeholder to be shown.
我们需要添加 <option></option>要显示的占位符。
HTML
HTML
<select id="Name">
<option></option>
<option value="John">John</option>
<option value="Brian">Brian</option>
<option value="Carl">Carl</option>
</select>
If I want the placeholder to appear.
如果我希望占位符出现。
Jquery
查询
$('#Name').select2({placeholder: 'Select a Name'});
$('#Name').select2('val', '');
If I want to see a value on the select2 input:
如果我想在 select2 输入上看到一个值：
$('#Name').select2('val', 'John');
回答by Jervie Vitriolo
The empty option is actually for placeholder, I solved it using the code below
空选项实际上是占位符，我使用下面的代码解决了它
var s1 = $('#select2id').select2({
multiple: true,
placeholder: "Select values"
});
s1.val([' ']).trigger("change");
the s1.val([' ']).trigger("change");did the trick
该s1.val([' ']).trigger("change");做的伎俩
回答by igor.vaynberg
leave the empty option and specify the placeholder text either via the data-placeholder attribute on the tag or via a placeholder option when initializing select2.
保留空选项并在初始化 select2 时通过标记上的 data-placeholder 属性或通过占位符选项指定占位符文本。
回答by honor
You could add a line to remove the first "empty" option after loading the options for roles. You could do it as below using jquery.
您可以在加载角色选项后添加一行以删除第一个“空”选项。您可以使用 jquery 执行以下操作。
$("#selectBox option[value='']").remove();
回答by bitifet
I've just faced the same problem and simple <option></option>didn't work to me.
我刚刚遇到了同样的问题，简单<option></option>对我不起作用。
It seems empty option is inserted but it doesn't allocate any height so it's impossible to reach it.
似乎插入了空选项，但它没有分配任何高度，因此无法到达它。
I solved by just adding a non-breaking-space( ) character (simple space didn't work too):
我通过添加一个不间断空格( ) 字符来解决（简单的空格也不起作用）：
<option> </option>
回答by Todor Todorov
Just try $('select').select2({placeholder: 'Please select...'});. Combined with an empty <option></option>should do the job ;).
试试吧$('select').select2({placeholder: 'Please select...'});。与空相结合<option></option>应该可以完成工作;)。
