如何让DIV可编辑、可拖动示例代码

前端技术 2023/09/09 JavaScript
1、可编辑：

<div id=\"move\" contentEditable=\"true\">可编辑</div>
设置contentEditable属性可以让div编程可编辑状态

2、可拖动：

$(\'#move\').draggable();
使用jQuery UI的draggable可以让div变成可拖动状态，但是如果两个属性同时应用就会出现可编辑功能失效的状况。

3、可编辑、可拖动：
复制代码 代码如下:

<div id=\"move\" contentEditable=\"true\">可编辑</div>
var divTitle=$(\'#move\');
[code]
<span style=\"font-size:18px\">divTitle.draggable().click(function ()
{
$(this).draggable({ disabled: false });
$(this).css(\'backgroundColor\', \'transparent\');
}).dblclick(function ()
{
$(this).draggable({ disabled: true });
$(this).css(\'backgroundColor\', \'#FFFF6F\');
});</span>

这样控制一下就可以让div同时具有edit和drag属性了。

本文地址：https://www.stayed.cn/item/23603

转载请注明出处。

本站部分内容来源于网络,如侵犯到您的权益,请 联系我

我的博客

人生若只如初见，何事秋风悲画扇。

我的标签

随笔档案