以编程方式移动可拖动位置答案

【问题标题】：Move draggable to position programmatically以编程方式移动可拖动位置
【发布时间】：2014-02-05 20:45:44
【问题描述】：

假设有一个只能在一个轴上拖动的可拖动对象。

有没有办法以编程方式移动它？要么开始，要么通过增量。当然我可以去更改它的 css left 属性，但这不会触发 jQuery 提供的拖动事件。

我期待找到可拖动的dragBy(x,y) 方法。

示例如下：http://jsfiddle.net/odyodyodys/daHU8/

html:

<div id="theButton">Reset position</div>
<div id="theDiv">Lorem ipsum dolor sit amet</div>

Js：

$("#theDiv").draggable({
    axis: "x",
    cursor: "pointer"
});

CSS：

#theDiv {
    display:block;
    width: 100px;
    height: 100px;
    overflow: hidden;
    margin-top: 80px;
    background-color: green;
}
#theButton {
    border: 1px solid;
    width:80px;
    cursor: pointer;
}

有没有办法在将可拖动元素（此处为 theDiv）沿 x 轴移动后将其移动一个增量或移动到初始位置？

【问题讨论】：

我在小提琴中遗漏了什么吗？
由于某种原因我无法保存它。编辑了问题以包含 jsfiddle 代码。对此感到抱歉。
Fiddle 现在可以了。对不起各位
没问题，我以为我要疯了
给你，伙计，我想这就是你想要的......jsfiddle.net/vwZMZ/2

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

【解决方案1】：

DEMO

使用额外的 javascript 源，您可以实现您想要的。

来自 jQuery UI：
jquery.simulate.js

来自第 3 方：
来源：http://j-ulrich.github.io/jquery-simulate-ext/
jquery.simulate.ext.js
jquery.simulate.drag-n-drop.js

感谢 j-ulrich 让它变得如此简单。

function dragTo(x, y) {
    $("#draggable").simulate("drag-n-drop", {dx: x, dy: y, interpolation: { stepWidth: 1, stepDelay: 1}});
}

【讨论】：