Question

我正在使用http://ivaynberg.github.io/select2/中的select2插件。

我有一个表单可以添加新行。我所做的是从前一行获取html并将其附加到我的表单。

所以这个工作，select2也被添加到新行。问题是当我点击select 2元素时没有发生任何事情。

有没有办法解决这个问题？

Answer 1

它无法按照您的方式运行的原因是因为复制HTML不会复制任何事件处理程序或其他select2功能。

为此，正如评论中所提到的，我们需要首先销毁原始的select2，克隆其DOM元素，然后重新初始化原始的select2，然后初始化副本。

将初始化分解为辅助函数可能更容易，例如：

$(document).ready(function() {        

    var $selectParent = $('#select-parent'),
        $copy;

    init($selectParent);

    $("#duplicate").click(function() {

        $selectParent.select2('destroy');

        var $copy = $selectParent.clone();
        $(".form").append($copy);

        init($selectParent);
        init($copy);

    });
});

function init($elem) {
    $elem.select2({
        minimumResultsForSearch: -1,
        width: 'resolve'
    });   
}

选中此JSFiddle

select2 from append not working

1 个答案: