如何使div成为可信和可拖动的

 Text to edit 
 $("#d").draggable(); 

我只能拖动这个div，但我怎么能编辑它（比如双击可编辑属性变为活动状态，点击拖动变为活动状态）？

Answer 1

 $("#d").draggable() .click(function() { $(this).draggable({ disabled: false }); }).dblclick(function() { $(this).draggable({ disabled: true }); });​​ 

DEMO

Answer 2

 $("#d") .draggable() .click(function(){ if ( $(this).is('.ui-draggable-dragging') ) { return; } $(this).draggable( "option", "disabled", true ); $(this).attr('contenteditable','true'); }) .blur(function(){ $(this).draggable( 'option', 'disabled', false); $(this).attr('contenteditable','false'); }); 

这是演示： http ： //jsfiddle.net/UH9UE/222/ 。

Answer 3

另一种选择是传递.draggable（{handle：“handleDiv”}），它允许你一直保持可拖动状态，并允许进行有意义的编辑。 只需使用内部有两个div来制作可拖动的div：句柄和你的contenteditable div。

API文档

Answer 4

 
 Text to edit 
 $(function(){ $("#d").click(function() { $("#d").draggable(); }); $("#d").dblclick(function(){ see here for this functionality http://stackoverflow.com/questions/2441565/how-do-i-make-a-div-element-editable-like-a-textarea-when-i-click-it }); });