重复的 CKEditor 小部件显示为已禁用

Question

我有一个概念表单列表，可以通过单击按钮在其中添加概念。问题是，当我单击并复制概念表单时，有一个表单字段可与 ckeditor 一起使用，并且新副本显示为已禁用且无法写入。

我获取表格，复制它并尝试初始化它但出现错误：

TypeError: $element.ckeditor is not a function

base.html:

<script type="text/javascript" src="{% static 'ckeditor/ckeditor-init.js' %}"></script>
<script type="text/javascript" src="{% static 'ckeditor/ckeditor/ckeditor.js' %}"></script>
<script type="text/javascript" src="{% static 'ckeditor/ckeditor/adapters/jquery.js' %}"></script>

functions.js:

$('.add-form').click( function(e) {
  console.log('add form function');
  var $form = $('#concept-0');
  var $copy = $form.clone();
  var $element = $copy.find('#id_concept-0-description');
  $element.ckeditor();

Answer 1

从复制我select对应于ckeditor小部件的元素，我用所需的配置重新初始化它，最后复制的内容被删除

functions.js:

var $element = $copy.find('#id_concept-0-description');
$element.ckeditor({
  "skin": "moono-lisa",
  "toolbar_Basic": [["Source", "-", "Bold", "Italic"]],
  "toolbar_Full": [
    ["Styles", "Format", "Bold", "Italic", "Underline", "Strike", "SpellChecker", "Undo", "Redo"],
    ["Link", "Unlink", "Anchor"],
    ["Image", "Flash", "Table", "HorizontalRule"],
    ["TextColor", "BGColor"],
    ["Smiley", "SpecialChar"],
    ["Source"]
  ],
  "toolbar": "Custom",
  "height": "200",
  "width": "100%",
  "filebrowserWindowWidth": 940,
  "filebrowserWindowHeight": 725,
  "extraPlugins": "autogrow,resize",
  "resize_enabled": true,
  "toolbar_Custom": [
    {
      "name": "clipboard",
      "items": ["Cut", "Copy", "Paste", "-", "Undo", "Redo"]
    },
    {
      "name": "basicstyles",
      "items": ["Bold", "Italic", "Underline", "Strike", "-", "RemoveFormat"]
    },
    {
      "name": "links",
      "items": ["Link", "Unlink"]
    }
  ],
  "language": "es"
});

$element.editor.setData('');

重复的 CKEditor 小部件显示为已禁用

Duplicate CKEditor widget appears as disabled

javascript

jquery

ckeditor