如何检查可拖动元素是否到达可放置区域？

Question

当我拖动可拖动元素并将其拖到可放置区域上时，我想为可拖动元素添加一个新类，以便我可以使用 CSS 更改其样式。这是我到目前为止得到的：

<aside>
    <div>1</div>
    <div>2</div>
    <div>3</div>
</aside>
<section></section>

$(document).ready(function(){
	
	//Test 
    $("aside div").draggable({
		revert: "invalid",
		containment: "document",
		helper: "clone",
		cursor: "move"
	});
 
    $('section').droppable({
		accept: "aside div",
		activeClass: "ui-state-highlight",
		drop: function( event, ui ) {
			//valami
			alert('lol');
		}
    });
	
});

aside {
    float:left;
    width:200px;
}

aside div {
    width:200px;
    height:100px;
    background:red;
    margin:0 0 10px 0;
}

section {
    float:right;
    width:400px;
    height:320px;
    background:green;
}

<link href="//code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" rel="stylesheet"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="//code.jquery.com/ui/1.10.3/jquery-ui.js"></script>

<aside>
    <div>1</div>
    <div>2</div>
    <div>3</div>
</aside>
<section></section>

Answer 1

来自 jQueryUi 文档http://api.jqueryui.com/droppable/#event-over

over( event, ui )Type: dropover

当接受的可拖动对象被拖动到可放置对象上时触发 （基于公差选项）。

你可能也对它的双重感兴趣

out( event, ui )Type: dropout

当接受的可拖动对象被拖出可放置对象时触发 （基于公差选项）。