javascript配置页面布局并保存,如何实现

Question

要实现一个功能:一.把功能区的已有的元素以拖动的方式复制到指定区域二.区域内的元素也可以随意拖动,三.可以编辑区域内的元素四.编辑好的区域内的内容保存到数据库(就是要保存元素的信息,还有拖动后的位置信息)
本人javascript不是很熟悉,看了一些拖动div的例子,但后面的搞不出来了,希望高人指点!!

Answer 1

类似于QQ空间那样可配置的？
一.把功能区的已有的元素以拖动的方式复制到指定区域
拖动没什么难的吧，网上到处都是DEMO二.区域内的元素也可以随意拖动,
同理三.可以编辑区域内的元素
这个编辑是什么意思？如果是修改元素创建元素的话，那就需要考虑哪些允许，哪些不允许 否则布局是问题四.编辑好的区域内的内容保存到数据库(就是要保存元素的信息,还有拖动后的位置信息)
用配置的方式保存。编辑好以后点击保存==>传递的数据是位置等信息 这些你需要配置以达到可扩展性
然后保存个性化

Answer 2

不知道元素布局得复杂不，不复杂的话让定位的元素全都position:absolute; 
这样做的话比较好取用户布局时拖动元素的位置，也就是该元素的
       left=event.clientLeft-父元素的scrollLeft
top也同理可得；
这样的话可能会对文档流有点影响，加载次序可能有点问题另外还要保存元素高宽、属性、背景等，但是获取的方法并不难

Answer 3

http://bbs.51js.com/viewthread.php?tid=68871&extra=page%3D4%26amp%3Bfilter%3DdigestCDrag 布局拖拽
这个和你的要求很像。

Answer 4

这个要说起来那就大了，要看你做到什么程度一般来说过程是这样的：给可以拖动的元素绑定一个拖动事件，当鼠标在元素内按下时，使该元素绝对定位，同时生成一个和目标元素在页面上占有的面积一样大小的DIV块占据元素原有的位置，这样页面不会因为要拖动的元素脱离了文档流而使页面变形。当选中元素被拖动后，判断它在页面上的位置，看是否大部分进入了一个可以容纳它的页面容器内，如果是，则将该元素appendChild（insertBefore）进这个容器内。如果拖动中放开鼠标，此时元素位置没有进入某个容器内，则删除占据位置的DIV，将元素appendChild（insertBefore）到它原来的容器内。现有的大部分可拖动布局的原理虽然略有不同，但基本都是这样。