可拖動一次只貪婪droppable的

降我有兩個可棄的div是非常接近對方在屏幕上（注：他們不是嵌套）。一個大的可拖動div被拖到兩個div的頂部;當鼠標被釋放時，可拖動的恰好落在兩個可放置的div上（即兩個可放下的事件被觸發）。可拖動一次只貪婪droppable的

我想要發生的是，在這種情況下，可拖動的將落在只有一個 droppable和其他。訂單根本無關緊要。

這樣做的最好方法是什麼？

一說，我便想起低效的方式是跟蹤所有投擲的事件時間戳，並拒絕投擲的事件，如果它有一個已經之前存儲在某些數組的時間戳。

來源

2009-04-15 Hady

我能以稍微不同的方式解決我的問題。讓我先回顧一下我的情況又是什麼：

我有非常接近對方屏幕
上我有一個可拖動的div不具有唯一的ID 2個可投放的div對象。這可拖動可以在我的droppables一次次被丟棄（即不被消耗，如果讓任何意義）
當拖動是兩個droppables的頂部，目前jQuery的行爲是，可拖動將達到這兩個droppables。這對我來說是不受歡迎的。

我預期的行爲：在拖動應該落在只有第一個投擲的，不應該被觸發任何其他後續可放開這是各地。

var tsArray = new Array（）;

$（ '可投放。'）可投放（{ 降：函數（）{

for (var i = 0; i < tsArray.length; i++) { 
    if (tsArray[i] + 150 > ev.timeStamp) { 
     return; 
    } 
} 

tsArray.length = 0; // Empty it for performance 
tsArray.push(ev.timeStamp); 

// Do any logic you require here

}）;

的基本思想是，當一個可拖動的是在兩個droppables下降，各可棄事件的事件時間戳都非常接近對方。它們相距毫秒。我只是做一個檢查，以確保它們之間有很大的時間差異。

來源

2009-04-16 09:45:33 Hady

在足夠慢的計算機上，或出於某種原因計算機打嗝，這可能無法正常工作。在某些情況下，可能要花費整整一秒的時間才能接受拖拽。考慮動態附加一個唯一的標識符到每個可拖動。這值得花5分鐘。 – KyleFarris 2009-04-16 13:20:32

這是行不通的凱爾。讓我們假設我是拖動「#boo」。當可拖動對象放在兩個可拖動對象上時，它們都將接收到具有唯一標識符「#boo」的可拖動事件。我一次只需要拖放一個拖動，即使它超過一個拖放。 – Hady 2009-04-17 12:26:24

你可以使用上可放開元素「數據」的方法來存儲到目前爲止，他們已經接受了拖拽元素的引用。所以，舉例來說，你可以做這樣的事情：

<script language="javascript"> 
$(function() { 
    $('.droppable').droppable({ 
     greedy:true, 
     [...other:options], 
     over: function(event,ui) { 
      var already_dragged = $(this).data('mysite.dropped_items'); 
      if($.inArray(ui.draggable.id,already_dragged) >= 0) { 
       $(this).droppable('disable'); 
      } 
     }, 
     out: function(event,ui) { 
      $(this).droppable('enable'); 
     }, 
     drop: function(event,ui) { 
      var already_dragged = $(this).data('mysite.dropped_items'); 
      if($.inArray(ui.draggable.id,already_dragged) < 0) { 
       already_dragged.push(ui.draggable.id); 
       $(this).data('mysite.dropped_items',already_dragged); 
      } 
     } 
    }).data('mysite.dropped_items',new Array()); 
}); 
</script> 

<div id="droppable1" class="droppable"></div> 
<div id="droppable2" class="droppable"></div> 
<div id="draggable_1" class="draggable"></div>

從本質上講這是什麼做的是這個...

我們使用jQuery的數據對象附加稱爲陣列「的mysite .dropped_items'給每個$（'。droppable'）元素。每當您將可拖動的鼠標拖放到其中一個可拖放對象上時，系統將檢查該可拖動對象的id是否已經在其'mysite.dropped_items'數組中。如果是這樣，那麼droppable將會被禁用。如果不是，一切都會按預期工作。

我沒有測試過的代碼，這個確切的塊，但在理論上，它應該工作。我希望有所幫助。

來源

2009-04-15 15:20:12 KyleFarris

邏輯是聲音。唯一的事情雖然是可拖動，我有沒有一個唯一的ID;主要是因爲同一個可拖動的元素被反覆使用。所以沒有一個唯一的ID，我應該存儲什麼作爲關鍵，以確定之前已經丟棄的可拖動 – Hady 2009-04-16 09:05:48

你可以簡單地只在指定的OVER，您可放開OUT的活動，禁止其他droppables。

喜歡讓說drop1和drop2都在DOM但彼此頂部無關，和你的下落drag1到他們。你可以簡單地訪問drop1的OVER，OUT，函數（如果這是優先的），並做OVER：禁用drop2，OUT：enable drop2

僞代碼，但我想你會知道如何它在jQuery中工作。

來源

2013-01-03 18:20:44 kchang4

可拖動一次只貪婪droppable的

回答

相關問題