0

次のコードがあります。

ドロップ可能エリア

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

$( "#droppable1" ).on( "dropout", function( event, ui ) {
                 $( "#droppable1" )
                .removeClass("ui-state-highlight").find( "p" )
                .html( "Drop Here" );
   });

ドラッグ可能なアイテム

$( "#draggable1" ).draggable({ 
     snap: ".ui-widget-header", 
     snapMode: "inner", 
     axis: "y", 
     containment: "#containment-wrapper", 
     scroll: false 
});

droppableすべて正常に動作しますが、アイテムが既にスペースに入っている場合、スペースが複数のドロップを受け入れるのを防ぐ方法を理解または解決できませんdropped

  1. #droppable1複数の を受け入れないようにコードを変更するにはどうすればよいdropですか?
  2. オプションを使用して.return、追加のアイテムをドロップしようとすると、単に元の位置に戻るようにすることはできますか?

編集:

$(".drop-zone").droppable({
drop: function(event, ui) { 
    $(this).droppable('option', 'accept', ui.draggable);
},
out: function(event, ui){
    $(this).droppable('option', 'accept', '.drag-item');
    }   
});

});

上記は以下にリストされているスレッドからのものですが、コードで実装するのに苦労しています。

新しいコード

$( "#droppable1" ).droppable({
        drop: function( event, ui ) {
            $(this).droppable('option', 'accept', ui.draggable);
        },
        out: function(event, ui){
            $(this).droppable('option', 'accept', '.drag-item');
        }   

    });

OK、これで上記のコードが機能するようになりましたが、実際にはこれが必要だとは思いません。ドラッグ可能なアイテムが実際にドロップされたり、人口の多いドロップ可能なスペースにスナップされたりするのを止める方法はありますか?

いつもありがとう、

H.

4

0 に答える 0