javascript - 如何将图像用作 div 内的可放置元素

Question

我在 div 中有一个可以放置的图像。我想在拖动元素并将鼠标悬停在图像上时调用 drop 函数。我做到了，但 drop 函数没有被顺利调用。下面是我的html代码

  <div id="divRecycle"><img id="imgRecycle" src="Images/RecycleBin.jpg"/></div>

下面是使用的css。

 .recycle-hover {
    padding: 10px;
    border:  2px dashed orange;
}

下面是javascript代码

function MakeRecycleBinDivDroppable() {
$("#imgRecycle").droppable({
    accept: ".sections,.cart-item",
    hoverClass: 'recycle-hover',
    helper: 'clone',
    cursor: 'move',
    drop: function (event, ui) {



        //check if the draggable element is a section or only a product.
        if ($(ui.draggable).hasClass("sections")) {
            //it is a section, we will delete the section and its products

        } else {

        }
    }
});

}