如何在jQuery droppable中继续更改droppable区域的颜色？

Question

请在这里查看我的jsfiddle：http://jsfiddle.net/fletchadam/mr5Uj/15/

当您从顶部拖动一个项目时，我希望您将鼠标悬停在其上以更改颜色的单个可拖放区域。

我相信诀窍在于这个函数：

function drag(ev){
    ev.dataTransfer.setData("Text",ev.target.id);
}

Answer 1

只需在allowDrop函数中添加您的样式：

function allowDrop(ev){
    ev.preventDefault();
    $(ev.target).css('background-color','#F00');
}

这将在元素上放置一个红色背景。现在要删除它，请使用dragleave事件：

<div id="div1" class="droparea clearfix" ondrop="drop(event)" ondragover="allowDrop(event)" ondragleave="removeStyle(event)">drag here</div>

使用这个Js函数：

function removeStyle(ev) {
     $(ev.target).removeAttr('style');
}

诀窍是使用事件的target，这是悬停的div。