jquery ui，在嵌套的droppable上悬停时检测真正的可放置区域

Question

我尝试在droppable个事件上构建嵌套drop位置我附加自定义HTML对象，它可能是droppable（这里总是droppable），
现在的问题是：

1. 如何通过当前选项再次为新的追加元素调用droppable？

2. 我想检测到真正的可投放区域，我是否正确或是否有更好的方法？
   （关于 droppable是嵌套的）




此处为示例：Fiddle

Answer 1

以下是我在评论中提到的更好的例子：

http://jsfiddle.net/Twisty/pd3pur85/

<强>的JavaScript

$(function() {
  function makeDrop(target) {
    target.droppable({
      greedy: true,
      tolerance: 'touch',
      drop: function(event, ui) {
        ui.helper.detach();
        var newDrop = $("<div>", {
          class: "drop"
        }).appendTo($(event.target));
        $('.drop').removeClass('drag-hover');
        makeDrop(newDrop);
      },
      over: function(event, ui) {
        $('.drop').removeClass('drag-hover');
        $(event.target).addClass('drag-hover');
      },
    });
  }

  makeDrop($(".drop"));

  $('.drag').draggable({
    revert: 'true',
    helper: "clone",
  });
});

然后，您可以在<div>期间将Droppable分配给动态创建的drop。

就你的over而言，我怀疑此时这是最佳用途。