1

私の理解では、Draggable UI のヘルパー オプションは、こちらで説明されている表示効果にすぎません。

しかし、テーブルで使用すると、バグが発生しているように見えます (追加位置が間違っています)。

例: http://jsfiddle.net/hmj83/

$(".no_clone_item").draggable({
    revert: 'invalid'
});

$(".clone_item").draggable({
    helper: 'clone',
    revert: 'invalid'
});

$("td").droppable({
    drop: function (event, ui) {
        $(ui.draggable).appendTo(this);
    }
});

誰でもこの動作を説明したり、回避策/修正を提供したりできますか?

ありがとう。

4

2 に答える 2

1

CSSをオンにして位置をリセットするのが最も簡単だと思います.drop()。

ui.draggable.css({ left: 0, top: 0 }).appendTo(this);

それは少なくともあなたの問題を解決します。

注: ui.draggable - 現在のドラッグ可能な要素、jQuery オブジェクト。

デモ: http://jsfiddle.net/tive/mJkd5/

topjQuery UI が css プロパティを追加し、ドラッグされた要素に追加する理由leftは、視覚的なフィードバックのためだけです。次の CSS を追加することで、ソリューションでこれをテストできます。

td img.no_clone_item {
    left: auto !important;
    top: auto !important;
}

この CSS を有効にすると、視覚的なフィードバックはありません。アイテムをドロップすると視覚的に移動します。

クローン要素を.draggable()受け取ると、視覚的なフィードバックのために位置がクローン要素に追加されます。

于 2013-05-26T07:07:43.297 に答える