javascript - Select2 动态元素不对事件使用react

Question

我正在使用Select2效果很好。但是，我使用下面的代码来创建新的动态 select2 下拉列表，但单击它们时它们不会使用react/打开。

var relationshipcounter = 0;

$('#AddMoreRelationships').click(function () {
    var $relationship = $('.relationship'); // div containing select2 dropdown
    var $clone = $relationship.eq(0).clone();
    $clone[0].id = 'id_' + ++relationshipcounter;
    $relationship.eq(-1).after($clone);

    $relationship.find('select').trigger('change'); // not working
});

屏幕截图:

JSFIDDLE:

http://jsfiddle.net/pHSdP/133/

Answer 1

我遇到了这个确切的问题，当然，我尝试的第一件事就是使用数据进行深层复制:

el.clone(true,true);

这不起作用。相反，我发现的最好的方法是:

el=other_el.clone()_etc; // cloning the old row
el.find('.select2-container').remove();
el.find('select').select2({width: 268});

这两个代码段中的

el 是包含 select 和 Select2 元素的 div 行。

本质上，我在第二个片段中所做的就是删除“旧”select2，它始终具有 .select2-container 类，然后在所有找到的 select 上重新创建它> 我的新行中的元素。