jQueryUI可排序，可拖动的恢复事件 [英] jQueryUI sortable,draggable revert event

问题描述

我遇到了jQuqeryUI的问题。
我想在无效目标上拖放元素时运行一些代码。
据我所知，这里没有预定义的事件，但我考虑过组合来自以下事件的信息：over，out，remove和stop，以实现这一目标。然而，这可能听起来像是一团糟，你有更清洁的方法吗？

I have a problem with jQuqeryUI. I would like to run some code whenever an element is dragged and dropped on an invalid target. As far as I can see, there is no predefined event for this, but I have thought about combining information from following events: over, out, remove and stop, to achieve this. However that might sound like it's going to be a mess, is there a cleaner way yo do it?

推荐答案

你可以传递一个 还原选项的方法，例如，如果我们采用这样的示例演示：

You can pass a method to the revert option as well, for example if we take the example demo like this:

<div id="draggable" class="ui-widget-content">
    <p>I revert when I'm not dropped</p>
</div>
<div id="droppable" class="ui-widget-header">
    <p>Drop me here</p>
</div>​

然后在您的可拖动上，您可以计算是否还原，像这样：

Then on your draggable you can calculate whether to revert, like this:

$("#draggable").draggable({ 
    revert:  function(dropped) {
       var dropped = dropped && dropped[0].id == "droppable";
       if(!dropped) alert("I'm reverting, what a cruel world!");
       return !dropped;
    } 
});

你可以在这里尝试一下，传入的 drop 参数是它被删除的元素 .droppable （），它只是 false 如果它落在其他任何地方。

You can give it a try here, the dropped parameter passed in is the element it was dropped on that's a .droppable(), it's just false if it landed anywhere else.

或者如果你'使用 接受选项你可能想要计算一下，如下：

Or if you're using the accept option you may want to calculate off that, like this:

var dropped = dropped && $(this).is(dropped.droppable('option', 'accept'));

这使用接受选择器并使用 .is（） 查看droppable是否匹配。

This uses the accept selector and uses .is() to see if the droppable matches.

您可以在此处查看该演示。

这篇关于jQueryUI可排序，可拖动的恢复事件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！