Javascript jQueryUI：如何将可拖放区域限制为多个div？

感觉问题已经得到了回答：

我有3个时间表和一些可拖动的元素放在那里。由于某种原因，我不能让它工作。这就是我使用的语法：

containment:“.timeline1、.timeline2、.timeline3”

$（函数（）{
$（“.timeline1、.timeline2、.timeline3”）.Dropable（）；
$（“.event”）.draggable({
包含：“.timeline1、.timeline2、.timeline3”
});
});
.timeline 1、.timeline 2、.timeline 3{
宽度：500px；
高度：40px；
边框：3倍灰色虚线；
边缘底部：10px；
}
.事件{
高度：40px；
背景：灰色；
显示：内联块；
}

跳舞
睡觉
eat
我不确定是否可以使用包含选项执行此操作，但可以使用snap、snapMode和revert来完成您尝试执行的操作

我想在时间线元素中添加一个常见类，如
timeline droppable
，以使其更容易：

<div class="timeline1 timeline-droppable"></div>
<div class="timeline2 timeline-droppable"></div>
<div class="timeline3 timeline-droppable"></div>

当然，您需要调整CSS，使事件元素与时间线元素完美匹配。
太棒了！
span
、
snapMode
和
revert
的组合完成了以下任务：）
$(function() {
    $(".timeline-droppable").droppable();

    $(".event").draggable({
        snap: ".timeline-droppable",
        snapMode: "inner",
        revert:  function(droppedElement) {
            var validDrop = droppedElement && droppedElement.hasClass("timeline-droppable");
            return !validDrop;
        } 
    });
});