jQuery UI Draggable - 更改还原位置？答案

【问题标题】：jQuery UI Draggables - Change Revert Position?jQuery UI Draggable - 更改还原位置？
【发布时间】：2009-07-15 14:16:09
【问题描述】：

是否可以编辑 jQuery UI 可拖动助手的还原位置？例如，我有一些图标，用户可以单击并拖动到页面上的组中。当用户单击图标并开始拖动时，只要他们继续按住单击，就会在光标下方显示一条帮助消息并跟随光标。如果助手被放入一个组中，它就会消失。如果助手没有被放入一个组中，它会使用 revert: 'invalid' 返回到它的原始位置。我的问题是，我可以编辑助手的原始位置吗？它似乎总是恢复到 left: 0 和 top: 0 的绝对位置，但我不知道如何编辑这些值。我需要将返回位置编辑为向左多 300 像素。

【问题讨论】：

This 回答另一个问题正是您想要的。不幸的是，对于另一个问题的提问者来说，这与他们想要的相反。

标签： jquery jquery-ui jquery-ui-draggable

【解决方案1】：

您可以尝试在拖动开始后重新定位可拖动元素，释放后元素将恢复到原始位置然后跳转到新位置 - 我还没有想出如何解决这个问题，但是这个方法有效

$(document).ready(function(){
 $(".dragMe").draggable({
  helper : 'clone',
  revert : true,
  start: function(e,ui){
   // when starting the drag, reposition the element
   $(this).hide().css({ position: 'relative', left: '-300px', top: 0 });
  },
  stop: function(e,ui){
   $(this).show();
  }
 });
 $("#dropBox").droppable({
  drop: function(e, ui) {
   ui.draggable.appendTo($(this)).show()
    // reset the position of the element to zero (so it fits in the drop box)
    .css({ position: 'relative', left: 0 })
   ui.helper.remove();
  }
 });
})

【讨论】：