2016-06-16 9 views
0

私は2つのドローパブルと2つのドラッグを持っています。JqueryUIドロップ可能な 'out'イベントは起動しません。

item1がtrash1にドラッグされても、item2はtrash1にドラッグできないため、元の位置に戻ります。

item1がtrash1からtrash2にドラッグされた場合、trash1は再び利用可能になり、 'out'イベントが発生しないために失敗します。ここで

コードです:

$(function() { 
     $(".item").draggable({ 
       revert: 'invalid', 
       cursor: 'move' 
     }); 

     $("#items").droppable({ 
       drop: function(event, ui) { 
        $("#trash").droppable("option", "disabled", false); 
        $("#trash2").droppable("option", "disabled", false); 
       } 
     }); 

     $("#trash").droppable({ 
       out: function() { 
        $(this).droppable("option", "disabled", false); 
        console.log('hi') 
       }, 
       drop: function(event, ui) { 
        $(this).droppable("option", "disabled", true); 
       } 
     }); 

     $("#trash2").droppable({ 
       out: function() { 
        $(this).droppable("option", "disabled", false); 
        console.log('hi') 
       }, 
       drop: function(event, ui) { 
        $(this).droppable("option", "disabled", true); 
       } 
     }); 
}); 

ここでフィドルです:http://jsfiddle.net/vMQVy/120/

誰もがこの問題を克服する方法を知っていますか?

答えて

1
  • あなたがドロップ可能な領域にドラッグ可能なオブジェクトをドロップすると「ドロップ」イベントが起動される
  • ドラッグ可能なオブジェクトがドロップ可能なゾーンを超えていたが、されず、このドロップ可能ゾーンを離れたときにも、解雇された「アウト」落ちたそれは、「終わり」の反対の出来事です。

あなたの例では、 'out'イベントを使用することは、それを達成するために行う必要がありません。

私が知る限り、ドラッグ可能なオブジェクトがどこにドロップ可能な領域にドロップされたのかを知ることはできません。

私が使用した解決策は、アイテムをドロップ可能領域にドロップするたびにそのアイテムの位置を保存することでした。それと同じように、アイテムが落とされるたびに別のゴミ箱に入っていたかどうかをチェックし、そうであればこのゴミ箱を再び有効にします。

関連する問題