Jquery 拖放不适用于动态可放​​置部分

Question

需求就像，有需要拖到编辑器中的项目列表。其中列表为可拖动，编辑器为可放置。

因此，当我调用 Jquery 拖放功能时，它工作正常，项目在编辑器中是可放置的。

但是当多个编辑器通过 ajax 或使用 jquery 动态添加时，项目应该能够在新生成的编辑器中放置。已经有添加更多编辑器的功能。

我为新生成的编辑器再次调用了拖放功能，但它只适用于现有的编辑器，不适用于新添加的编辑器。

可拖动部分是固定的，但可放置部分是多种动态的。

（注意：如果已经加载，它适用于多个编辑器，但如果我调用拖放功能并添加新编辑器，则一次。我再次调用拖放功能，不适用于新编辑器）

我的代码，

 function _dropable_cktext_editor(){
    $('.jqte_editor').droppable({
      drop: function( event, ui ) {
        var item_name = ui.draggable.find('.name').text().trim();
        $(this).append(" ["+item_name+"]");
      }
    });
  }
  function _dragable_cktext_editor(){
    $('#spec_type_groups_edit li ul li').draggable({
      revert: "invalid",
      containment: "document",
      helper: "clone",
      cursor: "move",
      start: function(e, ui)
      {
        $(ui.helper).addClass("ui-draggable-helper");
      }
    });
  }  

Answer 1

这是 JavaScript 的 loading/unloading 问题，您正在使用 Ck-editor 等编辑器克隆相同的输入。所以请先加载编辑器 JavaScript 然后再次加载 draggable JavaScript，然后它将工作 100%。