jquery - 如何检测该项目已被放入同一可排序列表中

Question

我有两个相连的可排序列表。当我将左侧列表中的一个元素拖动到右侧列表中的一个元素时，我的代码工作正常，但是如果我想知道左侧列表中项目的顺序，您能告诉我应该查找什么事件吗？当一个项目被拖放到同一列表中时(基本上是对同一列表中的项目进行重新排序，不是拖放到另一个列表，而是拖放到同一列表中)。

谢谢。

编辑:

以下是代码链接:http://jsfiddle.net/Hitman666/WEa3g/1/

因此，正如您将看到的，当在相反的列表中拖放项目时，我会收到警报，但当列表(例如绿色列表)重新排序时，我也需要一个事件。然后我需要提醒订单，例如:4,3,2,1

HTML:

<ul id="sortable1" class="connectedSortable">
    <li>Item 1</li>
    <li>Item 2</li>
    <li>Item 3</li>
    <li>Item 4</li>
</ul>

<ul id="sortable2" class="connectedSortable">
    <li>Item 5</li>    
    <li>Item 6</li>
    <li>Item 7</li>
    <li>Item 8</li>    
</ul>

CSS:

#sortable1, #sortable2 { list-style-type: none; margin: 0; padding: 0; float: left; margin-right: 10px; }
#sortable1 li, #sortable2 li { margin: 0 5px 5px 5px; padding: 5px; font-size: 1.2em; width: 120px; }

#sortable1 li{background: green;}
#sortable2 li{background: yellow;}

Javascript:

$(function() {
    $("#sortable1, #sortable2").sortable({
        connectWith: ".connectedSortable",
        receive: myFunc
    }).disableSelection();

    function myFunc(event, ui) {
        alert(ui.item.html());
    }
});

Answer 1

您需要使用更新事件。这是我的示例(请注意，我进行了 2 个额外的函数调用来进行排序，因为您只需要左侧列表中的 evt):

$(function(){
    $( "#sortable1" ).sortable({
        connectWith: ".connectedSortable",
        update: myFunc
    });

    $( "#sortable2" ).sortable({
        connectWith: ".connectedSortable",  // deactivate:myFunc
    });

    function myFunc(event, ui){
        var b = $("#sortable1 li"); // array of sorted elems
        for (var i = 0, a = ""; i < b.length; i++)
        {
            var j=i+1; // an increasing num.
            a = a + j + ") " + $(b[i]).html() + '\n ' //putting together the items in order
        }
        alert(a)                 
    }
});

希望这有帮助。