jQuery ui.draggable事件/状态恢复

如果可拖动的元素被还原，是否有方法获取信息

---

我被困在这上面了。我想让一个元素再次可拖放，但前提是放在那里的可拖放对象被移到了其他位置（意思是不会恢复）。

看起来jQuery UI不支持它，所以您可以像这样自己添加它：

$.ui.draggable.prototype._mouseStop = function(event) {
    //If we are using droppables, inform the manager about the drop
    var dropped = false;
    if ($.ui.ddmanager && !this.options.dropBehaviour)
        dropped = $.ui.ddmanager.drop(this, event);

    //if a drop comes from outside (a sortable)
    if(this.dropped) {
        dropped = this.dropped;
        this.dropped = false;
    }

    if((this.options.revert == "invalid" && !dropped) || (this.options.revert == "valid" && dropped) || this.options.revert === true || ($.isFunction(this.options.revert) && this.options.revert.call(this.element, dropped))) {
        var self = this;
        self._trigger("reverting", event);
        $(this.helper).animate(this.originalPosition, parseInt(this.options.revertDuration, 10), function() {
            event.reverted = true;
            self._trigger("stop", event);
            self._clear();
        });
    } else {
        this._trigger("stop", event);
        this._clear();
    }

    return false;
}

将允许您执行以下操作：

$(document).ready(function($) {
    $('#draggable').draggable({
        revert: true,
        reverting: function() {
            console.log('reverted');
        },
        stop: function(event) {
            if (event.reverted) {
                console.log('reverted');
            }
        }
    });
});

---

我发现有一个可以获取有关对象是否已恢复的信息。它内置于jQuery中，但显然没有那么好的文档记录

本质上，它是通过对可拖动对象的revert选项使用回调函数来完成的

如下所示：

$(".myselector").draggable(
{
  revert: function(droppableObj)
  {
     //if false then no socket object drop occurred.
     if(droppableObj === false)
     {
        //revert the .myselector object by returning true
        return true;
     }
     else
     {
        //droppableObj was returned,
        //we can perform additional checks here if we like
        //alert(droppableObj.attr('id')); would work fine

        //return false so that the .myselector object does not revert
        return false;
     }
  }
});

---

有关更多详细信息，请参阅。

扩展@mbeedub的解决方案，下面是我自己的解决方案。在我的例子中，我需要

ui.position

on

stop

的值。如果拖动被恢复，那么我需要将对象返回到其原始位置。不幸的是，jQuery UI在运行还原动画后不会更新

位置

属性。幸运的是，有一个

originalPosition

属性。所以，只要我能够检测到还原状态（在本例中，通过classname），我就可以了

---

谢谢。覆盖是个好主意。我将对此进行测试，但看起来完全符合我的需要。嗯，我不知道，droppableObj是一个布尔值，正如您的代码所示。你不能按照你在评论中说的去做——使用droppableObj来获取属性。或者你可以在另一个版本的jquery中，我使用的是最新版本。这很好用。谢谢我同意这应该是可以接受的答案。不幸的是，由于revert没有收到事件或ui参数，因此它仍然需要一些线索才能将还原的信息获取到后续事件中。我想我会。添加类或。数据什么的。。。但是谢谢你的提示！

function updatePosition (position) {
  /* Posting position to server */
}

element.draggable({

  drag: function (event, ui) {
    updatePosition(ui.position);
  },

  revert: function (droppable) {
    return !droppable && element.addClass('ui-draggable-reverted');
  },

  stop: function (event, ui) {
    if (element.is('.ui-draggable-reverted')) {
      updatePosition(ui.originalPosition);
      element.removeClass('ui-draggable-reverted');
    } else {
      updatePosition(ui.position);
    }
  }
});