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');
});

<强> Fiddle

在内容可编辑div中选择jquery draggable中的文本

1 个答案: