jQuery UI 保存可拖动元素的位置答案

【问题标题】：jQuery UI save position of draggable elementjQuery UI 保存可拖动元素的位置
【发布时间】：2016-08-03 16:39:00
【问题描述】：

有没有办法保存可拖动元素的初始位置，在拖动结束时确定位置，然后将元素返回到初始位置？

【问题讨论】：

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

【解决方案1】：

您可以使用stop 事件和ui 参数的originalPosition 值来获取原始位置。

一旦你有了原始位置 - 你可以使用 $(this).animate 和 originalPosition 的值将元素移动到那个位置

这是一个例子：

$( ".drag" ).draggable({
  stop: function( event, ui ) {
    console.log(ui.originalPosition)
    $(this).animate(ui.originalPosition)
  }
});

<script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/jqueryui/1.10.0/css/smoothness/jquery-ui-1.10.0.custom.min.css" />
<script src="//cdnjs.cloudflare.com/ajax/libs/jqueryui/1.10.0/jquery-ui.js"></script>

<div style="width: 50px; height: 50px; border: 1px solid red;" class="drag"> Drag Me! </div>
<div style="width: 50px; height: 50px; border: 1px solid green;" class="drag"> Drag Me! </div>

【讨论】：