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()コールバックがないので、.draggable要素の作成後に追加するだけです。

$(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 に答える