克隆行后未呈現jquery選擇

Question

我在一次噩夢中試圖克隆表行后使jQuery Chosen插件正確呈現。 我搜尋並嘗試了許多建議和“保證的修補程序”，但沒有任何效果。

根據我的嘗試，我可以顯示一個標准選擇框（或不顯示），或者可以顯示一個選擇框，它僅控制原始行:(

這是最新的版本，它刪除了預先選擇的div，並顯示一個標准選擇框。

請注意，我能夠通過簡單地添加所需的類將所有其他選擇呈現為選擇選擇-“選擇選擇”，“選擇選擇無單選”等，document.ready在每個對象上創建帶有selected（）的集合，任何選擇的類別

要復制的HTML行：

   <tr id='formListRow' class='row'>
    <td><input id='itmDesc0' name='itmDesc0' class='long lockableField' type='text' placeholder='Description' value=''></td>
    <td>
     <select id='itmCategory0' name='itmCategory0' class='chosen-select-no-single'>   
      <options></option>
     </select>
    </td>
   </tr>

JS

var $row = document.getElementById("formListRow"); // find row to copy
var $newRow = jQuery($("#formListRow")).clone (true); // copy children too
$newRow.attr('id','newRow' + itm); // change id or other attributes/contents
$newRow.find('select').each(function(){
  $(this).removeClass().removeAttr('id').css('display','block').next().remove();
  $(this).attr('name','itmCategory' + itm);
  $(this).attr('id','itmCategory' + itm);
  $(this).addClass('chosen-select-no-single');
  $(this).chosen();
});


$("#formListRow").before($newRow);

指導是超級贊賞。 J.P

更新

創建另一個用於測試目的的函數，以便選擇的插件可以在插入新克隆的元素后應用於新克隆的元素，這也沒有什么區別：

function setNewChosen(itm){
    $(".chosen-select-no-single").last().chosen();
}

Answer 1

動態創建元素后，需要應用插件。

這應該工作：

$newRow.find('select').each(function(){
  $(this).removeClass().removeAttr('id').css('display','block').next().remove();
  $(this).attr('name','itmCategory' + itm);
  $(this).attr('id','itmCategory' + itm);
  $(this).addClass('chosen-select-no-single');
  $(this).chosen();
});

請注意，原始行應該是本機選擇元素，而不是選定元素。