Javascript 使用Dragula可编辑的js span元素不工作

Javascript 使用Dragula可编辑的js span元素不工作,javascript,jquery,dragula,Javascript,Jquery,Dragula,我使用d dragula来拖动元素,我需要将这个移动的元素设置为可编辑 当可编辑元素不在“移动/复制元素到”中时,它将工作 如何解决这个问题?我想,这是javascript js$(文档)的问题。准备从span创建一个文本区域 JS function divClicked() { var divHtml = $(this).html(); var editableText = $("<textarea />"); editableText.val(divHt

我使用d dragula来拖动元素,我需要将这个移动的元素设置为可编辑

当可编辑元素不在“移动/复制元素到”中时,它将工作

如何解决这个问题?我想,这是javascript js$(文档)的问题。准备从span创建一个文本区域

JS

function divClicked() {
    var divHtml = $(this).html();
    var editableText = $("<textarea />");
    editableText.val(divHtml);
    $(this).replaceWith(editableText);
    editableText.focus();
    // setup the blur event for this new textarea
    editableText.blur(editableTextBlurred);
}

function editableTextBlurred() {
    var html = $(this).val();
    var viewableText = $("<span class=\"editable\">");
    viewableText.html(html);
    $(this).replaceWith(viewableText);
    // setup the click event for this new div
    viewableText.click(divClicked);
}

$(document).ready(function () {
    $("span.editable").click(divClicked);
    $('#btn').click(function () {
        divClicked.call($('div#one'));
    });
});
<div class='parent'>
    <label for='hy'>Copying stuff is common too, so we made it easy for you.</label>
    <div class='wrapper'>
      <div id='left-copy-1tomany' class='container'>
        <div id="block"><div><span class='handle'>+</span>When elements are copyable, <span class="editable">Here is my original text.</span></div></div>
        <div id="block"><div><span class='handle'>+</span>Copying prevents original elements from being dragged. A copy gets created and <em>that</em> gets dragged instead</div></div>
        <div id="block"><div><span class='handle'>+</span>Whenever that happens, a <code>cloned</code> event is raised</div></div>
      </div>
      <div id='right-copy-1tomany' class='container'>

      </div>
    </div>
  </div>