jQuery 和 HTML5 拖放到表格中（调度程序）

Question

我一直在使用 jsfiddle.net 尝试制作一个调度程序的原型，将要调度的项目拖放到其中。我已经从“未分配”列表中拖放到工作计划表上。我还能够从日程表中删除工作。让我头疼的是将桌子上的一个项目移动到桌子的另一部分。

小提琴位于here。对于让内部拖放工作的任何建议，我将不胜感激。我整天都在做这件事，而且我的视力开始模糊。哦，无论如何，如果你认为我正在做的事情可以做得更好，请做出改变，让我知道小提琴的版本。

更新

根据@SMathew 和@darksky 我已经重建了整个小提琴，我没有直接移动表格单元格，而是它们的内容。

我知道你们推荐使用divs 和/或spans，但我想使用表格的结构，尤其是rowspan，以30 分钟为增量指定单元格的高度。它现在确实工作得更好了，唯一的错误是移动单元格（或者它们的内容），因为我必须在源站点恢复受rowspan 影响的单元格并删除与rowspan 冲突的单元格在目标站点。

更新的小提琴可以在here找到。

更新 2（最终版）

所以，我又回到了绘图板上，经过 64 次摆弄，我终于让它做我想做的事。最后，在不操纵表结构的情况下让一切正常工作的诀窍。我所要做的就是将行跨度的单元格设置为display: hidden。

无论如何，对于任何感兴趣的人，新的小提琴是here。我确实发现 Chrome 在处理 API 时存在一些问题。我已经在小提琴中注意到了它们（以及部分咆哮）。

Answer 1

问题是您试图使 td 元素可拖动。当您从这样的表格中删除/插入 td 元素时，您必须创建一堆空单元格来平衡它。我建议保持表格完整，并将可拖动元素包装在 div 或 span 标签中。这样表结构永远不会改变。您的代码也将更加简单和高效。