0

我有简单的列表项层次结构,例如

<ul>
    <li>Personal Details
        <ul style="position: relative; left: 0px; top: 0px;" class="ui-draggable">     
            <li>First Name</li>
        <li>Last Name</li>
        </ul>
    </li>
    <li>Employment Details
         <ul style="position: relative;" class="ui-draggable">
             <li>Title</li>
             <li>Department</li>
         </ul>
    </li>
</ul>

http://jsfiddle.net/grimmus/PtzF4/1/

我只想允许子列表项可拖动。因此,您不能拖动个人详细信息,但可以拖动名字、姓氏等。

我尝试在可拖动之前使用 children() 但它会拉动所有孩子而不仅仅是一个:-)

有谁知道我怎么能做到这一点?请检查小提琴 - http://jsfiddle.net/grimmus/PtzF4/1/

谢谢

4

2 回答 2

3
$('#results').delegate('li li', 'mouseover', function ()

您只需要将选择器更改为仅子元素。

http://jsfiddle.net/PtzF4/2/

于 2013-02-22T11:43:32.057 回答
0

两个问题:draggable()每次鼠标悬停时都会在元素上重新运行;delegated()已弃用。如果您要做的只是拥有一个可拖动元素的静态列表,那么只需使用each().

$('#results .ui-draggable li').each(function() {
    $(this).draggable({
        revert: true,
        revertDuration: 0
    });
});

如果您希望能够动态添加元素并使它们可拖动(根据代码,这是您想要执行的操作),请查看:http:
//jsfiddle.net/PtzF4/4/
已删除无关的东西让 jsfiddle 脾气暴躁,并添加了一个记录器来显示我的版本和 Selven 关于重新运行的版本之间的差异draggable()

于 2013-03-07T07:30:11.577 回答