1

我正在尝试动态创建可以拖动的 div。但我发现，整个父 div 也随之移动。如果我创建多个子 div，它们也会与父级一起移动。我究竟做错了什么？这是我的代码：

$(function() {
    $( "button#new-child" )
        .button()
        .click(function( event ) {
            event.preventDefault();
            $("#creation-box").append("<div class='draggable  ui-widget-content'><p>Drag me around</p></div>").draggable();

        });
});

和html

<body>
<div id="toolbar">
<div class="header"> <h3>Toolbar</h3></div>
<button id="new-child">New Child</button>
</div>

<div id="creation-box">
<div class="header"><h3>Creation Box</h3></div>
</div>

</body>
4

1 回答 1

2

因为您将父级设置为可拖动。仅在创建后将新元素设置为可拖动。

顺便说一句，.append()没有回调，所以只需添加.draggableafter 元素创建。

$(function() {
    $( "button#new-child" )
        .button()
        .click(function( event ) {
            event.preventDefault();
            $("#creation-box").append("<div id='new-element-with-unique-id' class='draggable ui-widget-content'><p>Drag me around</p></div>");

            $("#new-element-with-unique-id").draggable();

        });
});
于 2012-10-31T21:34:52.017 回答