JQuery拖放保存位置

Question

我正在使用JQuery拖放来创建在诸如www.bbc.com等网站上使用的仪表板。是否可以在拖放控件后保存控件的坐标？如果是这样，任何人都有他们会推荐的网站或文章？

谢谢！

Answer 1

如果您只是想要控件的坐标，只需在拖动停止后使用 http://api.jquery.com/offset/，然后将这些坐标保存到数据库。

但是，如果元素捕捉到网格，则可能需要计算哪个网格列和该列中该元素位于哪个位置。

Answer 2

难道你不能在drop上发送一个函数，它使用ajax向服务器发送有问题的控件的坐标和大小并保存它？

如果是“正常”拖放，那么您可以使用stop函数。

$(".selector").draggable({ stop: 
function(event, ui) { $.ajax(...) } 
}); 

Answer 3

你想在哪里保存它们？

您可以编写一个函数来保存容器内的位置，当用户完成移动触发一个事件的控件：

stop: function(event, ui) { ... } 

在那里，你可以使用偏移功能得到控件的位置。

Regards

Answer 4

您正在寻找ui.position属性。

$("#foo").draggable(); 
$("#foo").bind("dragstop", function (e, ui) 
{ 
    console.log(ui.position.top); 
    console.log(ui.position.left); 
}); 

事件可以拖动方法中的约束，但我已经离开了这样的清晰度。

More Information

Answer 5

$(this).draggable({revert:true}); 

这将有助于您拖动控制移动到原来的位置时，拖动被释放