2

番号のリストと 2 つの宛先ブロックがあります。ターゲット ブロックに番号をドロップしたいのですが、最後にドロップしたアイテムのみを保持します。

jsfiddle のサンプル -デモ - は、1 つのアイテムのみをドラッグできます。

コード -

$(function() {
    $("ul.droptrue").sortable({
        connectWith: "ul",
    });

    $("ul.dropfalse").sortable({
        connectWith: "ul",
        dropOnEmpty: false
    });

    $("#sortable1, #sortable2, #sortable3").disableSelection();

    $("#sortable3,#sortable4").on("sortreceive", function(event, ui) {
        var $list = $(this);

        if ($list.children().length > 1) {
            $(ui.sender).sortable('cancel');

            //Move the existing one back to sortable1
            //Only keep the last moved element
        }
    });
});

上記の例で、ユーザーが 2 番目の数値を sortable3 または 4 にドラッグしようとすると、別の数値は許可されません。私が期待している動作は、新しい番号がドラッグされた場合、前の番号が sortable1 リストに戻る (原点に戻る) ことです。

ありがとう。

4

2 に答える 2

0

コードは次のように単純にすることができます

 $("ul.droptrue:not(:#sortable1)").on("sortreceive", function (event, ui) {
    $(this).children().not(ui.item).appendTo("#sortable1")
});

更新されたフィドル

余分な反復は不要

于 2014-08-16T10:22:27.103 に答える