当达到可放置限制时，jQuery UI draggable / sortable / droppable禁用drop

JS Bin演示

任务：

我正在使用jQuery UI创建一个事件调度程序。 事件具有一定的长度（以分钟为单位），并且可以拖动到不同的日期，每个日期都有自己的最大长度（以分钟为单位）。 在该示例中，每天的最大长度为480分钟，并且应该允许不超过480分钟的“事件”。

问题：

如果“事件”将导致“日期”超过其最大时间长度（基于已经丢弃的元素的组合时间），则应禁用该“日期”（此特定事件不允许丢弃）。

从演示中可以看出，我可以计算出每天事件的合并时间（“可用分钟数”在拖动停止时更新），但我不知道如果拖动事件，如何禁用掉入当天会导致“可用时间”变为负数。

Answer 1

这里最容易做的就是在开始时运行一个function来检查是否有任何房间将被完全预订。 我修改了你在这里提供的演示： 修改演示

它当然可以使用一些细化，但基本上它会检查你正在拖动的事件的长度，并且在没有足够时间的情况下隐藏任何房间的可排序的ul。 我把房间藏起来因为禁用它们会生效太晚。 我还在每个房间ul之前在html中添加了一个跨度，以便在没有足够时间时显示。 可能最好用js添加它，但不是很多时间进行细化。

希望有所帮助！

Answer 2

$( "#daybox" /*or selector for days elements*/ ).bind( "sortreceive", function(event, ui) { if(/*percent*/ >= 100) $(ui.sender).sortable('cancel'); }); 

然后，被删除的元素返回到组。