我有一个照片列表,并且添加了可拖动的内容,但是当照片被拖动到父 div 之外时,我想更改它的类,这样它表明如果您删除它,它将被删除,然后当用户放下它时,我希望它触发一个功能。 (仅当它位于父级 div 之外时)
<ul class="photos">
<li><img src=""/></li>
<li><img src=""/></li>
</ul>
因此,当将 li 拖到 .photos 外部时,它会触发添加类,然后如果将其拖放到其外部,则会触发事件以将其删除。
最佳答案
假设您提到的父 div
是可放置的,您可以将事件处理程序绑定(bind)到 dropout
事件:
$("#parentDiv").on("dropout", function(event, ui) {
//ui.draggable refers to the draggable
});
只要将接受的可拖动对象拖到可放置对象的容差区域之外,该事件就会触发。
更新(见评论)
您可以向revert
选项提供回调函数。该函数可以采用一个参数,该参数要么包含可拖动对象被放置在其上的可放置对象,要么包含 false
(如果它被放置在无效的地方):
$("#draggable").draggable({
revert: function(valid) {
if(!valid) {
//Dropped outside of valid droppable
}
}
});
这是一个working example .
关于jQuery 可拖动,当拖放到父 div 之外时发生事件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/9317293/