【发布时间】：2011-05-07 16:06:34
【问题描述】：
设置：
我有一个用 JS 编写的页面，其中包含 3 个主要 div：相册、照片和图像容器。每张照片都是可拖动的，容器是可放置的（实际上放置的照片也是可拖动的，以允许图像交换和删除）。我已经使用 jquery-ui 库进行拖放。
要求：
现在，我想再添加 2 个页面，并将这 3 个页面组合在一起成为一个向导，用户可以使用下一步和返回按钮来回移动。
- 每个页面都显示照片的容器（当然之前输入的所有数据都必须显示）
- “下一步”和“后退”按钮可在页面之间导航移动并保存所有数据。
- 拖动的照片仍然可以在 div 中拖动
- 应该兼容所有主流浏览器
- 易于实施 ;)
问题：
该案例的最佳解决方案是什么？
我想到了几个选项：
- 使用表单并使用提交按钮进行导航。 缺点：保存状态数据可能很棘手，因为图像容器需要保存图像操作，例如旋转和裁剪等。
- 使用 iFrame 作为照片和相册部分的包装，并在用户导航时替换每个页面的框架内容。 缺点： 框架对 SEO 不友好（或者我弄错了吗？），图像可能难以在 iframe 和图像容器之间拖动。
- 使用 ajax 替换照片和相册 div 并加载不同的 div。
我确信还有许多其他优点和缺点，并且可能还有其他方法可以做到这一点。因为在我想知道编写向导的最佳方式之前，我从未实现过向导。
谢谢！
【问题讨论】：
标签： jquery iframe drag-and-drop draggable wizard