0

我希望能够draggable()在 jquery 中的某些事件上拖动（jquery ui）后将可拖动的 div 重置为其原始位置。我这样做了：

$('#nav').draggable();

$('#nav').data({'x': $("#nav").css('left'), 'y': $("#nav").css('top')});

$("#c").click(function () {
    $('#nav').animate({'left': parseInt($("#nav").data('x')) - 15, 'top': parseInt($("#nav").data('y')) - 14}, {duration : 500});
});

它甚至可以在较旧的 Firefox 中使用，但不能在最新的 Opera 和 Chrome 中使用。我试图用 attr() 替换 data() ，它仍然是一样的。

如何以更跨浏览器的方式实现这一点？

编辑：这里是这个代码：http: //jsfiddle.net/MVCA6/

4

2 回答 2

1

这里的问题是 jQuery UI Draggable 使用topandleft属性来移动元素，而您使用bottomand设置红色框的位置right；

添加console.log($('#nav').data())到 click 事件中，您将看到您的属性x，并且y都设置为auto.

要解决这个问题，您需要更新 CSS 以使用top和定位红色框left。

示例：http: //jsfiddle.net/MVCA6/1/

附带说明：当涉及到调试问题时，正确的代码缩进有助于产生奇迹。

于 2014-07-24T10:59:02.547 回答
1

在 chrome 中，我已经看到了使用的结果

console.log($("#nav").data('x'));

它返回auto；

在Mozilla它给

447px

可能这可能是它在 chrome 中不起作用的原因。但是如果您在 css 中将 #nav 中的 left 和 top 属性分配为

left:447px;top:352px

它工作正常。 在此处查看演示

有关更多详细信息，您还可以从这里获得帮助

于 2014-07-24T10:59:26.310 回答