2

私はjQueryとjQuery UIが初めてです。div を親 div から別の div に移動しようとしています。これまでのところ、私の「記事」はドラッグ可能です。「ドロップ可能な」ストックは、記事が上に移動したときに記事を適切に識別しますが、この記事をストックに添付する方法が見つからないようです。

「jQueryオブジェクトにカプセル化されたdiv」を操作していると思いますが、ここで少し迷っています。

<div id="shelf" class="shelf">
    <div class="article">article</div>
</div>

<div id="stock" class="stock">
</div>

次に、記事をストック div に追加し、シェルフ div から削除するためのスクリプトがあります。

<script>

    $('.article').draggable();

    var stockArea = $('#stock').droppable();

    stockArea.bind( "drop", function(event, ui) {

        if ($(this).find(".article")){
            console.log('appending ' + ui);
            $(this).append(ui);
        }
    });
</script>

私はこれを間違っていますか?ありがとう、

4

1 に答える 1

4

UI 自体にイベント引数が含まれています。必要なアクションを実行するために必要なことは次のとおりです。

<script>

    $('.article').draggable();

    var stockArea = $('#stock').droppable({
        drop: function (event, ui) {
            var target = $(event.target);
            $(ui.draggable).appendTo(target).remove();
        }
    });
</script>

Update ui.draggableは、特定の要素への参照です。

于 2012-09-10T09:47:38.833 に答える