jQuery droppable悬停事件在第一次尝试时不会触发

Question

我遇到了第一次尝试可丢弃区域不接受可拖动物品的问题。后来的尝试似乎工作正常。

请参阅此代码 - http://jsfiddle.net/grimmus/Pp9Qf/

//binding droppable property to generated columns
$("#contents").delegate('li', 'mouseover', function () {
    $(this).droppable({
        activeClass: "ui-state-active",
        hoverClass: "ui-state-hover",
        accept: ".ui-draggable",
        drop: function (event, ui) {
            $("<span></span>").text(ui.draggable.text()).appendTo(this);
        }
    });
});

您可以通过从右侧区域的下拉列表中选择一个数字并按添加来创建面板。

创建的面板中的框都是可放置的。然后，从选择模型＆＃39;中选择员工。下拉列表。

当可接受的拖动项悬停在其上时，可放置区域应显示虚线边框。这似乎是我第一次尝试时发生的事情。如果我再次重新标记该项目，则会出现悬停类并接受该项目。

任何想法可能会出错？似乎没有正确初始化

在Chrome和Firefox中测试过。

由于