Select2：覆盖格式选择中的'container'

Question

Select2的formatSelection函数提供了一个container，它是所选选项应该追加到的DOM元素。

http://ivaynberg.github.io/select2/index.html#documentation

我用这个作为一个多项选择执行，我没能找到一种方法来替代默认的容器，这是.select2-search-choice。我希望用户选择一个选项并让它出现在输入字段本身以外的位置。

在看Select2的来源和addSelectedChoice方法，我不确定你实际上能够更改容器。任何帮助是极大的赞赏。

Answer 1

我临时解决方案：

添加一个外观类似容器到你的页面：

<div class="select2-container select2-container-multi" style="width: 200px;"> 
    <ul class="select2-choices choicesOutput"></ul> 
</div> 

这将是用来保存所选择的选项的容器。

然后，在addSelectedChoice功能，替换下面的行：

choice.insertBefore(this.searchContainer); 

与此：

choice.appendTo("ul.choicesOutput"); 

然后，如果你不希望输出框在那里当什么事都没有已选中，请将此样式添加到您的CSS：

ul:empty 
{ 
    display: none; 
} 

如果您希望位置是动态的，您可以跟踪呼叫链并传递参数以替代ul.choicesOutput。