Question

我一遍又一遍地试过，但我似乎可以让文本可编辑而且可拖动，因为当我应用.draggable（）时，contenteditable =＆＃34; true＆＃34;变成＆＃34;假＆＃34;。

的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;
}

Answer 1

你可以这样做，如果双击它就可以编辑，但单击会拖动它。

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

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

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

position: relative;
  top: -20px;

如何使div可拖动和满足=＆＃34; true＆＃34;？

1 个答案: