HTML拖放持久性

Question

我想给用户一个拖放屏幕，他们可以在那里移动东西。我可以使用HTML5和JQuery Draggable来实现这种体验。

问题是，如何在服务器端保留元素的位置，以便在用户重新访问页面时可以重新创建新位置。我不想跟踪每个（x，y）坐标并存储在数据库中，而是想在用户移动元素时动态生成“自定义”css文件，然后将该css文件存储在服务器中。不幸的是，我只是想知道我不知道如何跟踪运动并生成css文件。

任何提示或某些框架都会有所帮助。

Answer 1

刚刚使用此http://jqueryui.com/draggable/，我观察每当我们移动div时它会改变其内联样式（顶部，左侧，右侧，底部）。我在移动后复制了它的样式属性并刷新了页面。

刷新后，div返回到原始位置，现在我将复制的样式属性粘贴到div上，然后它复制了样式。

因此，您可以将一组元素ID作为键和样式属性保存为值。将其上传到服务器或您可以使用localStorage @ client。在页面上重新加载获取数组并设置内联样式：）

我在过去的项目中有类似的要求但是丢弃目标是固定的....就像可以将tile放到<li>元素的数组上。我通过按顺序仅存储<li>元素的索引来处理它。

Answer 2

我建议您查看http://diveintohtml5.info/storage.html以将值存储在客户端。否则，您可以在服务器上将该值作为YAML或JSON进行处理，但这将更多地与该线程相关。