用javascript保存框的坐标

这是我的小提琴：

如您所见，我有两个盒子，它们是可拖动的（使用jsPlumb）。当我点击“保存”按钮时，我希望能够保存他们所处的位置。我想保存X和Y坐标，我应该如何做或如何处理

我想存储它们，然后以XML格式（即x=10，y=10）发布到数据库：

10
10

---

编辑：取出容器

您需要的似乎是jquery的

.offset（）

函数。它提供了元素相对于文档的位置。

这是我在拖动时获取鼠标位置所做的操作。你这边可能需要稍作改动

var top , left;
component.draggable({
  cursor: 'move',
  stop: function (event, ui) {
        top = ui.position.top;
        left =  ui.position.left;
  }
});

从这里可以获得对象的位置，以便根据保存操作存储该位置。

---

希望这对您有用。

要存储元素的所有css属性，请使用以下代码（迭代所有元素的代码，并将其存储在可以转换为JSON并发送到服务器保存的数组中）：

现在属性存储在单个字符串中，用“，”分隔。在重新使用时，使用以下方法拆分字符串：

var inf=str.split(",");

---

其中inf[0]=id\u值，inf[1]=top\u值，…，inf[4]=width\u值。

保存哪个x和y坐标？相对于父元素，相对于文档？另外，您可能使用了错误的包含元素

jsPlumb.draggable（“1”，{containment:html}）可能应该像
body
一样，因为现在元素只在小提琴顶部移动。它应该是相对于文档的，现在我使用样式字段中的“top”和“left”填充它们
var str=$('#elem').attr("id") +","+ $('#elem').css("top") +","+ $('#elem').css("left") +","+ $('#elem').css("height") +","+ $('#elem').css("width");

var inf=str.split(",");