在jQuery克隆中创建微型MCE的克隆

Question

我必须创建一个形式的克隆，我已经使其类似于波罗。

        <div id="form-field" class="form">
            <input type="text" name="coursename" id="firstname" value="coursename" />
            <input type="text" name="institutename" id="institutename" value="institutename" />
            <input type="text" name="startdate" id="startdate" value="startdate" />
            <input type="text" name="enddate" id="enddate" value="enddate" />
            <textarea name="content" style="width:100%"></textarea>
            <label for="education-info">Educational Information</label>              
        </div>      
        <!-- clearfix -->
        <div class="clear"></div>
        <!-- /clearfix -->
        <input class="submit" type="submit" name="submit_second" id="submit_second" value="" />

现在，我使用下面编写的jquery来创建上述表单的克隆。但是我不能得到微小的MCE编辑器。我怎样才能获得完整的微型MCE编辑器。

我的表单克隆的jQuery。

  jQuery('.addeducation-sym').click( function(){
    jQuery('#form-field').clone().appendTo('#form-field');
  });

Answer 1

如果你试图复制一个已经初始化的表单，你将会失败。

如果你在复制表单后初始化tinymce，你需要确保你得到编辑器的html元素有一个唯一的id。此id将用作编辑器id，如果您尝试初始化两个具有相同id的编辑器，则会出现错误。

Answer 2

如果基本元素(例如textarea)上有一个ID，并且这个元素也被克隆，那么你就有两个具有相同ID的元素。在HTML中是不允许的，而且由于tinymce默认情况下从元素ID中获取它的实例ID，所以克隆不会真正工作。

诀窍是首先使用以下命令删除编辑器

tinymce.remove();

然后使用jquery克隆您的元素。

在将克隆的元素写入DOM之前，需要重命名任何克隆的元素的ID，使其具有惟一的ID。

然后将克隆写入DOM，然后调用

tinymce.init(TINYMCE_SETTINGS);

其中，TINYMCE_SETTINGS是您在中所有设置的对象。