2016-06-16 29 views
0

我有2个droppable和2个draggables。JqueryUI droppable'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'事件并不是你必须做的。

就我所知,您无法知道拖放对象从放入可放置区域之前在哪里。

我使用的解决方案是每次将物品放置在可放置区域时存储物品的位置。像这样,每次物品被丢弃时,你都会检查它是否在另一个垃圾箱中,如果是,那么你重新启用这个垃圾箱。