5

イメージを 2 つのコンテナー (コンテナー 1 とコンテナー 2) のいずれかにドラッグできるようにしたいと考えています。そこから、イメージがドロップされたコンテナーに応じて、データベース呼び出しでそのコンテナーを更新したいと思います (または、テーブルの 1 つの行を更新するだけです)。

これを実現するためにhttp://jqueryui.com/demos/droppable/を使用したいのですが、リクエストを処理する方法と、各コンテナーにイベントハンドラーをリッスンさせる方法がわかりません (画像）。

私が何を意味するかを説明するために、以下に非常に悪い図を描きました。

ドロップ可能なシステムの図

4

1 に答える 1

5

ドロップ可能なデモは、この種のことを行う方法を正確に示しています。

$(function() {
    $( "#draggable" ).draggable();
    $( "#droppable" ).droppable({
        drop: function( event, ui ) {
            $( this )
                .addClass( "ui-state-highlight" )
                .find( "p" )
                    .html( "Dropped!" );
        }
    });
});

私自身の本当に基本的なデモ → (更新済み)

于 2011-02-26T23:53:06.493 に答える