Jquery - 如果'draggable div'的大小大于'droppable div',则不会发生丢弃事件

Question

可能重复:
jQuery UI可拖动到较小的droppable

我有一个可拖动的div和一个可放置的div.可拖动div的高度和宽度大于可放置div.所以掉落事件没有发生.

<div id='draggable' style="width:500px; height:500px;">
       ABCABC
</div>


<div id='droppable' style="width:100px; height:100px;">
       XYZXYZ
</div>


$('#droppable').droppable({
          drop: function( event, ui ){
                        alert("Drop event occured");
          }
});

当我使draggable div的维度小于dropable div时,drop事件成功触发.

请指导我如何解决这个问题.

Answer 1

您可以在droppable方法中更改tolerance选项touch

http://jqueryui.com/demos/droppable/#option-tolerance

$( "#droppable" ).droppable({ tolerance: "touch" });

默认值为intersect,这意味着您的可拖动div必须与droppable div重叠50%.