jQuery和HTML5拖放到表(调度程序)

时间:2012-08-02 05:28:13

标签: javascript jquery html5 drag-and-drop

我一直在使用jsfiddle.net尝试创建一个调度程序原型,其中要调度的项目被拖放到其中。我已经从一个未被分配的"拖放到了#34;列表并进入计划表工作。我也有能力从日程表中删除工作。我在困难时间环绕着我正在将桌子上的物品移动到桌子的另一部分。

小提琴位于here。我很欣赏任何关于让内部拖放工作的建议。我整天都在努力工作,而且我开始变得模糊不清。哦,无论如何,如果你认为我所做的事情可以做得更好,请做出改变,让我知道小提琴的版本。

更新

根据@SMathew和@darksky,我重建了整个小提琴,我并没有直接转移桌面细胞,而是改变了它们的内容。

我知道你们推荐使用div和/或span,但我想使用表格的结构,特别是rowspan来指定单元格的高度以30分钟为增量。它现在确实工作得更好,唯一的错误是移动单元格(或更多内容),因为我必须恢复受源站点rowspan影响的单元格,并删除将与{ {1}}在目标网站上。

可以找到更新的小提琴here

更新2(最终)

所以,我又回到了绘图板,经过64个小提琴后,我终于得到了我想要的东西。最后,在不操纵表结构的情况下让一切工作正常的技巧。我所要做的就是将行间隔的单元格设置为rowspan

无论如何,对于任何有兴趣的人来说,新的小提琴是here。我确实发现Chrome在处理API方面存在一些问题。我已经在小提琴中注意到了它们(以及部分咆哮)。

1 个答案:

答案 0 :(得分:8)

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