javascript - 在内容可编辑的 div 中选择文本，这是 jquery 可拖动的

Question

我有一个 contenteditable div，它是另一个 div 的子级，它使用 jquery 制成可拖动元素。

<div id="draggable">
  <div id = "editable" contenteditable="true"/>
</div>

$('#draggable').draggable({revert:true});

我面临的问题是没有禁用任何默认鼠标操作，例如选择文本等。此外，如果我尝试选择一些文本，它只会拖动整个 div。我试过这样的事情：

$('#editable').mousemove(function(event){
  event.stopPropogation();
})

但这只是防止任何鼠标拖动动作。它还可以防止文本选择。我们如何才能使子内容的所有内容编辑鼠标操作都可编辑，同时将可拖动内容保持在父项上？

Answer 1

尝试这样的事情：

var draggableDiv = $('#draggable').draggable();

$('#editable', draggableDiv).mousedown(function(ev) {
     draggableDiv.draggable('disable');
}).mouseup(function(ev) {
     draggableDiv.draggable('enable');
});

小提琴