在內容可編輯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'); 
}); 

Fiddle