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

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>

- passatgt

---

使用over事件！ http://api.jqueryui.com/droppable/#event-over - user1835565

Answer 1

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

over( event, ui )类型：dropover

当可接受的可拖动对象基于tolerance选项被拖到放置目标上时，触发此事件。

你可能也会对其双重事件感兴趣

out( event, ui )类型：dropout

当可接受的可拖动对象基于tolerance选项从放置目标中拖出时，触发此事件。

- A. Rama

---

我正在寻找一个类似于可拖动的事件，但我猜我也可以从这里向可拖动的 div 添加一个类。谢谢。 - passatgt

在over函数中，ui.draggable是刚刚经过可放置区域的可拖动元素。不幸的是，out函数没有这个参数，因此您需要找到另一种解决方案来进行清理工作。 - A. Rama