可拖动一次只贪婪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的

回答

相关问题