0

ここの jsfiddle で気づきました - http://jsfiddle.net/stevea/T4sGh/1/ - 赤いボックスをベージュのボックスにドラッグ アンド ドロップすると、赤いボックスがベージュのボックスの内側に入るように見えますが、 HTML では、実際にはベージュ ボックスの兄弟になり、ベージュ ボックスの上に配置するためのオフセットが与えられます。

<body style="cursor: auto;">
   <div id="box" class="ui-droppable"></div>
   <div id="redBox" class="ui-draggable" style="position: relative; left: 89px; top: -213px;"></div>
</body>

これは予想外でした。これについて説明しているjQuery-UIのドキュメントを思い出せません。ここで何が起こっているのかを感じている人はいますか?おそらくドキュメントを教えてくれますか?

ありがとう

4

2 に答える 2

1

draggableとはdroppableデフォルトで DOM を変更しません。それを行いたい場合は、それらが公開するイベントを利用できます。ここにあなたのフィドルが更新されました。ドロップ時にコンテナーdraggable内の位置を変更するために、ドロップ イベントを使用しています。droppable

var cell_dropOps = {     
    drop : box_drop,        
    accept : '#redBox',
    drop: function (event, ui) {
        $(this).append(ui.draggable);
        ui.draggable.css({ top: 0, left: 0});
    }
};
于 2013-07-29T06:17:34.157 に答える