Question

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

<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/

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

我尝试在draggable之前使用children（）但是它会拉过所有的孩子而不只是一个： - ）

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

由于

Answer 1

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

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

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

Answer 2

两个问题：每次鼠标悬停时，都会重新运行元素draggable();不推荐使用delegated()。如果您要做的就是拥有可拖动元素的静态列表，那么只需使用each()。

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

如果您希望能够动态添加元素并使其可拖动（这是您希望根据代码执行的操作），请查看以下内容：
http://jsfiddle.net/PtzF4/4/ <删除了使jsfiddle脾气暴躁的无关的东西，并添加了一个记录器来显示我的版本和Selven关于重新运行draggable()的区别。

jQuery ui拖动孩子不是父母

2 个答案: