jquery - 如何在 JQuery Select2 插件中使用选定值创建占位符文本

Question

我可以在 Select2 中创建占位符文本。但是，仅当选择为空时(即，直到用户选择某个值)才会显示占位符文本。

我想以某种方式指示用户允许使用多个值，方法是将“输入下一个值”之类的内容显示为占位符文本在之前已选择的值之后。

类似这样的事情:

这可能吗？

Answer 1

就像 AFAIK 评论的那样，这是不可能的。

但是您可以尝试使用占位符和allowClear 属性来解决此问题。在这种情况下，选择第一个项目后，select2 将向您显示一个清晰的按钮，您可以用文本动态替换该按钮，如以下演示所示:

$(function() {
$(".js-example-basic-multiple").select2({
    placeholder: "Select a state",
    allowClear: true
});
$(".js-example-basic-multiple").on("select2:select", function (e) {
    $(".select2-selection__clear").text("Enter next value or Clear");
});
$(".js-example-basic-multiple").on("select2:unselect", function (e) {
    $(".select2-selection__clear").text("Enter next value or Clear");
});
});

<link href="//cdnjs.cloudflare.com/ajax/libs/select2/4.0.1/css/select2.css" rel="stylesheet"/>

<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/select2/4.0.1/js/select2.js"></script>
<select class="js-example-basic-multiple" multiple="multiple" style="width: 248px;">
    <option value="AL">Alabama</option>
    <option value="WY">Wyoming</option>
    <option value="NY">New York</option>
    <option value="CA">California</option>
</select>