Question

为了演示，我创造了这个小提琴：http://jsfiddle.net/Lxmr1n4p/4/

在网络游戏中，我有几个绝对定位的图层，一个在另一个之上。在这些层中有可放置的元素。

在小提琴中，我制作了一个黑色div作为可拖动元素。如果我将它放在大的midgrey drop目标上，它会正确警告，它会在第2层掉落。

但是，如果我把它放在深灰色的区域，它会说在第2层掉落，当我点击它时它也会警告它掉落在第1层，这是我不想要的，因为（除此之外它还落后第2层中的项目，第1层中的项目与此操作无关，在其上方有一个完整的图层。

这是布局：

<div class="layer1">
    <div class="r">
        <div class="item"></div>
    </div>    
</div>
<div class="layer2">
    <div class="r">
        <div class="item"></div>
    </div>
</div>

<div class="drag"></div>

div.r只是制作一个相对的框。

这是我的javascript：

$(document).ready(function () {
    $('.layer1 .item').droppable({
        drop: function () {
            greedy: true,
            alert('dropped on item in layer 1');
        }
    });

    $('.layer2 .item').droppable({
        drop: function () {
            greedy: true,
            alert('dropped on item in layer 2');
        }
    });

    $('.drag').draggable({});
});

有没有办法告诉jqueryui我只想让最上面的项触发drop事件？这个例子不是真正的游戏代码，因为它是大的。

Answer 1

您可以在悬停时禁用其他可放置的元素：

over: function(event, ui){
      $( ".layer1 .item" ).droppable( "disable" )
},
out: function(event, ui){
     $( ".layer1 .item" ).droppable( "enable" )
 }

http://jsfiddle.net/Lxmr1n4p/5/

jQueryUI为第一个droppable后面的每个元素拖动项目fires drop

1 个答案: