jQuery draggable,在父div之外被删除的事件

Question

我有一个照片列表,并且我已经添加了draggable,但是当将照片拖到父div之外时,我想要更改它的类,这样就表明如果删除它,它将被删除,然后当用户丢弃它,我希望它启动一个功能.(只有在父div之外)

<ul class="photos">
<li><img src=""/></li>
<li><img src=""/></li>
</ul>

所以当li被拖到.photos之外时,会触发添加类,然后如果它被丢弃在它之外,那么它会触发并触发事件以将其删除.

Answer 1

假设div您提到的父级是一个droppable,您可以将事件处理程序绑定到该dropout事件:

$("#parentDiv").on("dropout", function(event, ui) {
    //ui.draggable refers to the draggable
});

只要将已接受的拖动拖动到可放置的容差区域之外,该事件就会触发.

更新(见评论)

您可以为该revert选项提供回调函数.该函数可以使用一个参数,该参数包含可拖放拖放的droppable,或者false(如果它被丢弃某处无效):

$("#draggable").draggable({
    revert: function(valid) {
        if(!valid) {
            //Dropped outside of valid droppable
        }
    }
});