JqueryでSelect2をクローニングする

Question

divをselect2ドロップダウンでクローニングする際に問題が発生します。

最初のページの読み込み時に最初のものが表示されると、select2が正常に動作します。クローンを作成するためにボタンをクリックすると、次のselect2は作成されません。それは障害のようであり、動作しません。

私のコードは以下の通りです。

<div class="input-main white_bg cloneneedsanalysis"> 
<div class="action-input clone-needs-analysis"> 
<div class="action-input-white-shorter"> 
<div class="inner-sub-title-less-padding"> 
<p>Audience Analysis</p> 
</div> 
<div class="col-md-12"> 
<div class="form-group"> 
<select class="select2 select2-multiple need_analysis_selector" multiple="multiple" data-placeholder="Choose ..." name="needs_analysis[]"> 
<option value="">-- Choose Audience Categories --</option> 
<option value="536"> Finance - - Cash collection</option> 
<option value="537">IT - - Comms IT</option> 
<option value="538">Strategy - - Strategy team 1</option> 
</select> 
</div> 
</div> 
</div> 
<div class="action-input-plus-needs-analysis"> 
<a href="#" class="clone_needs_analysis_button"> 
<img src="http://www.test.com/assets/images/plus.jpg"></a> 
</div> 
<div class="action-input-remove-needs-analysis"> 
<a href="#" class="remove_needs_anaylsis_button"> 
<img src="http://www.test.com/assets/images/minus.jpg"></a> 
</div> 
</div> 
</div> 


$(document).on('click', '.clone_needs_analysis_button', function(e) { 
    e.preventDefault(); 
    $(this).closest('.clone-needs-analysis').clone().insertAfter('.cloneneedsanalysis:last'); 
    $(this).closest('.action-input-plus').hide(); 
    $(this).closest('.action-input-remove').removeClass('hidden'); 
    $('.select2').select2(); 
}); 

Answer 1

$(this).closest('.clone-needs-analysis').clone()の代わりに$(this).closest('.clone-needs-analysis').clone(true, true)を使用してください。

添付されたイベントを複製するようにJQueryに指示するには、true, trueパラメータを指定する必要があります。

はhere