Heim >Web-Frontend >js-Tutorial >如何让DIV可编辑、可拖动示例代码_javascript技巧

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

WBOY
WBOYOriginal
2016-05-16 17:22:101063Durchsuche
1、可编辑:

可编辑

设置contentEditable属性可以让div编程可编辑状态

2、可拖动:

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

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

可编辑

var divTitle=$('#move');
[code]
divTitle.draggable().click(function ()
{
$(this).draggable({ disabled: false });
$(this).css('backgroundColor', 'transparent');
}).dblclick(function ()
{
$(this).draggable({ disabled: true });
$(this).css('backgroundColor', '#FFFF6F');
});


这样控制一下就可以让div同时具有edit和drag属性了。
Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn