Question

我的问题是，当我对列表进行排序时，drop-function会启动。

JS

$(document).ready(function rt()
{
    $("#div1").draggable();
    $("#k1").sortable({ revert: '100' });
    $('#droparea').droppable({ accept: 'li', drop: function() { alert('ssss'); } });
});

HTML

 <div id="div1" style="z-index:5;">
    <ul id="k1" style="width:350px; height:200px; background-color:#ffffff; margin:20px; padding:10px; border:1px solid #000000; ">
        <li>One</li>
        <li>two</li>
        <li>three</li>
    </ul>

</div>

<div id="droparea" style="position:absolute; top:0px; left:0px; width:100%; height:100%; background-color:#cccccc; z-index:1;"></div>

工作示例

http://www.jsfiddle.net/V9Euk/130/

提前签名。彼得

Answer 1

首先，您的问题标题具有误导性 - z-index是一个CSS属性，当两个或多个元素占据相同的空间时，它决定哪个元素会在彼此之上显示，并且与该元素无关。你在这里遇到的问题。

解决问题的方法非常简单：将包含列表的div置为可删除，然后使用贪婪选项阻止drop事件冒泡。

看看这里：http://www.jsfiddle.net/DKZRp/1/

jQuery droppable忽略了z-index？

1 个答案: