我有一个 jQuery UI droppable,它接受 Draggables。如果满足某些条件,我不想允许 drop 操作。
如何取消放置操作并执行类似还原操作?
可放置小部件上的accept
选项:
与选择器匹配的所有可拖动对象都将被接受。如果指定了函数,将为页面上的每个可拖动对象调用该函数(作为第一个参数传递给函数),以提供自定义过滤器。如果应接受可拖动对象,则该函数应返回 true。
结合revert
draggable 上的选项应该可以满足您的需求:
$(".draggable").draggable({
revert: 'invalid'
});
$("#droppable").droppable({
accept: function(el) {
/* This is a filter function, you can perform logic here
depending on the element being filtered: */
return el.hasClass('acceptable');
}
});
请注意,在这个特定示例中,您还可以编写accept: ".acceptable"
,这将使 droppable 只接受具有 class 的元素acceptable
。因此,另一种选择是当您的自定义事件发生时,只需根据需要应用或删除acceptable
该类。
这是一个例子:http: //jsfiddle.net/andrewwhitaker/rUgJF/3/
底部有一个切换“可接受性”的链接。