基础 CSS 和 jQuery Select2答案

【问题标题】：Foundation CSS & jQuery Select2基础 CSS 和 jQuery Select2
【发布时间】：2015-02-04 17:51:26
【问题描述】：

我正在尝试将 jQuery Select2 与 Zurb Foundation CSS 集成，但遇到了一些麻烦。

我需要能够指定一个元素以用于存储多选的选定选项。此元素需要与包含输入搜索框的元素分开。

下图显示了两个 Foundation CSS 行，每行有两列（标题行“Country”除外）。最左边一列的标签和最右边一列的输入。目前下图未与 Select2 集成。

我正在尝试以某种方式实现 Select2，它会像下面的屏幕截图一样显示。（注意：我显然是手动编辑了 HTML 以这种格式显示）。

我试图实现的最终 HTML 结构如下。

<div class="select2-container select2-container-multi row">
<ul class="select2-choices">
<li class="select2-search-choice"></li>
...
</ul>
</div>
<div class="small-3 columns">my label</div>
<div class="small-9 columns">
<div class="select2-search-field"></div>

我的问题是，如何通过专门告诉 jQuery Select2 将选定选项列表放置在哪里以及将搜索框放置在哪里来实现第二张图片中的布局？

【问题讨论】：

您的问题是什么？
对不起，我更新了问题的结尾，所以它准确地解释了我想要完成的事情。

标签： javascript jquery css zurb-foundation jquery-select2

【解决方案1】：

已经有一些人在整合foundation5和select2方面付出了一些努力。也许 cviebrock 的要点可能会有所帮助？ https://gist.github.com/cviebrock/8056741.

如果您正在寻找替代方案，请尝试。 Roy McKenzie 的基金会专用插件：http://roymckenzie.github.io/foundation-select/

【讨论】：