我使用dragula拖动元素,我需要将此移动的元素设置为可编辑。
当可编辑元素不在移动/复制元素中时,它正在工作。
如何解决这个问题?我认为,这是问题javascript js $(文件).ready editable从跨度制作textarea。
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'));
});
});
HTML
<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>