Javascript 如何在div中使用image作为可拖放元素

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

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

下面是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 {

        }
    }
});

---

}

您能制作一个JSFIDLE来显示问题吗？

调用不顺畅是什么意思？提供一个复制您的问题的演示。我希望在拖动的元素悬停在图像上时触发drop事件。现在，当鼠标不在图像上，而是在随机位置时，会发生drop事件。为什么您需要Dropable中的
helper
和
cursor
选项？JSFIDLE示例将非常有用。
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 {

        }
    }
});