gpt4 book ai didi

javascript - 如何使 div 可拖动且可编辑 ="true"?

转载 作者:太空宇宙 更新时间:2023-11-04 11:34:28 30 4
gpt4 key购买 nike

我试了一遍又一遍,但我似乎只能让文本变得可编辑和可拖动,因为当我应用 .draggable() 时,contenteditable="true"变成了"false"。

Javascript

$(".note").keyup(function() {
$(this).css('height' , '100%');
});

HTML

<div class="note" contenteditable="true">
<span id='close' onclick='this.parentNode.parentNode.removeChild(this.parentNode)'>
<img src="images/close.png" height="30" width="30" align="right" style="vertical-align: top; float: right"/>
</span>
</div>

CSS

.note {
width: 280px;
height: 130px;
padding-top: 20px;
margin-top: 60px;
margin-left: 25px;
padding: 2;
word-break: break-word;
font-family: Note;
font-size: 20px;
background-image: url("images/stickynote.png");
background-repeat: no-repeat;
background-size: cover;
z-index: 1;
}

最佳答案

您可以这样做,这样如果您双击它,它将是可编辑的,但单击会拖动它。

$(".note").draggable()
.click(function() {
$(this).draggable( {disabled: false});

}).dblclick(function() {
$(this).draggable({ disabled: true });
});

将此添加到关闭按钮 <img>代码会将其保存在容器的右上角:

position: relative;
top: -20px;

关于javascript - 如何使 div 可拖动且可编辑 ="true"?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31842212/

30 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com