使用jQuery將自定義ID添加到克隆的HTML節點？

我有這樣的HTML被克隆用JavaScript ...使用jQuery將自定義ID添加到克隆的HTML節點？

<tr class="empty-row screen-reader-text"> 
    <td><a class="button remove-row" href="#">-</a></td> 
    <td><input type="text" class="widefat" name="name[]" /></td> 


    <td><input type="text" class="widefat" name="url[]" value="http://" /></td> 
    <td><a class="sort">|||</a></td> 
    <td> 
     <textarea id="editor"></textarea> 
    </td> 
</tr>

當點擊一個按鈕，它克隆上面的HTML錶行並將其作爲一個新行到DOM與這個JS/jQuery的.clone(true)。 ..

<script type="text/javascript"> 
jQuery(document).ready(function($) { 
    $('#add-row').on('click', function() { 
     var row = $('.empty-row.screen-reader-text').clone(true); 
     row.removeClass('empty-row screen-reader-text'); 
     row.insertBefore('#repeatable-fieldset-one tbody>tr:last'); 
     return false; 
    }); 
}); 
</script>

我的問題

我需要從HTML textarea的上面ID editor ...

<textarea id="editor"></textarea>

我需要運行這個JavaScript把它變成在WordPress一個所見即所得的編輯器，下面id值是每個新行/編輯添加到DOM獨特的價值...

tinyMCE.execCommand('mceAddControl', false, id);

由於HTML行被複製爲clone(true)，它會複製上一行的同一個確切編輯器實例，因爲我無法設置並啓動一個新的編輯器，它只能使用唯一的ID。

那麼我怎麼能重現所有這些功能，同時允許添加到DOM的新行具有自定義ID值，並且在新行被添加到DOM之後對該新ID運行tinyMCE.execCommand('mceAddControl', false, id);？

來源

2016-04-20 JasonDavis

ATLEAST表現出一定的方式對答案進行評論，是否爲你工作或沒有。 –

我建議你在克隆後刪除重複的ID並使用一個名爲insted的類。如果ID重複，TinyMCE不會創建編輯器。

$(".screen-reader-text").clone().find("textarea").removeAttr("id").addClass("editor");

然後編輯綁定代碼會，

tinyMCE.execCommand('mceAddControl', false, ".editor");

來源

2016-04-20 07:26:37

對不起，我剛剛測試。我必須最終爲每個新編輯器添加一個唯一的ID。如果我使用共享課程，原因是以前的編輯會在添加新編輯時退出工作。我會將我的解決方案發布給其他人，因爲我的搜索導致很多人試圖完成這個，但沒有運氣，但我現在就開始工作。感謝你的回答 – JasonDavis

使用jQuery將自定義ID添加到克隆的HTML節點？

回答

相關問題