将 select2 应用于克隆节点中的元素？

Question

全部，

我有一个 PHP 模板文件，它生成一个隐藏的 div 和 3 select 个字段。

<div>
    <div class="form-group accessory collapse">
        <select class="accessory" style="width:50%">
        </select>

        <span class="input-group-addon">×</span>

        <select class="accessoryQuantity" style="width:10%">
        </select>

        <select class="accessoryType">
        </select>
    </div>

使用 jQuery 像这样克隆这些节点：

$newItem = $('.form-group.accessory.collapse').clone();
$newItem.removeClass('collapse');

然后我尝试像这样将 select2 应用于克隆的 jQuery 对象，但它只会弄乱整个克隆节点。

$newItem.select2();

如何将 select2 应用到克隆的节点？[=13=]

注意：我尝试将 select2 应用于隐藏的 selects，但是当您克隆它时，它会弄乱 select2 下拉列表。

Answer 1

尝试改变

$newItem = $('.form-group. .accessory .collapse').clone();

至

$newItem = $('.form-group.accessory.collapse').clone();

Answer 2

我过去遇到过同样的问题，我发现解决它的最佳方法是在克隆原始元素之前销毁 select2，然后重新初始化 select 2 原版和克隆版。

例如

$original.select2('destroy');
var $clone = $original.clone();

// add the clone to the DOM, e.g.
$clone.insertAfter($original);

$original.select2({options});
$clone.select2({options});

整个过程非常快，所以我看到 select2 在原始 select 上被销毁并重新初始化没有任何问题。

将 select2 应用于克隆节点中的元素？

Apply select2 to elements in cloned node?

jquery

jquery-select2