javascript - jQuery ui 可排序 toArray 跳过 1 项

Question

我试图在顺序更改后将 itemWrapper 中的所有 li id 放入一个数组中。

它确实做到了这一点，但它总是丢失一件元素。有多少李并不重要。每次都缺少一个 li id。

我做错了什么？

var result = "";
$("#itemWrapper").sortable({change: function(event, ui) {
    result = $("#itemWrapper").sortable("toArray");
}});
$(".colItem").disableSelection();

<ul id="itemWrapper" style="list-style-type:none;">
<li class="colItem ui-state-default" style="margin-right:-5px;" id="item_48_0_1"><img src="../images/items/1309680939.jpg" width="190" height="130" alt="3768" /></li> 
<li class="colItem ui-state-default" style="margin-right:-5px;" id="item_50_0_1"><img src="../images/items/1309681037.jpg" width="190" height="130" alt="3765" /></li> 
<li class="colItem ui-state-default" style="margin-right:-5px;" id="item_58_0_1"><img src="../images/items/1309681326.jpg" width="190" height="130" alt="3768" /></li> 
<li class="colItem ui-state-default" style="margin-right:-5px;" id="item_51_0_1"><img src="../images/items/1309681056.jpg" width="190" height="130" alt="11090" /></li> 
<li class="colItem ui-state-default" style="margin-right:-5px;" id="item_52_0_1"><img src="../images/items/1309681077.jpg" width="190" height="130" alt="3766" /></li> 
<li class="colItem ui-state-default" style="margin-right:-5px;" id="item_53_0_1"><img src="../images/items/1309681100.jpg" width="190" height="130" alt="3769" /></li> 
<li class="colItem ui-state-default" style="margin-right:-5px;" id="item_54_0_1"><img src="../images/items/1309681118.jpg" width="190" height="130" alt="11092" /></li> 
<li class="colItem ui-state-default" style="margin-right:-5px;" id="item_55_0_1"><img src="../images/items/1309681135.jpg" width="190" height="130" alt="11077" /></li> 
<li class="colItem ui-state-default" style="margin-right:-5px;" id="item_56_0_1"><img src="../images/items/1309681155.jpg" width="190" height="130" alt="3762" /></li> 
<li class="colItem ui-state-default" style="margin-right:-5px;" id="item_57_0_1"><img src="../images/items/1309681177.jpg" width="190" height="130" alt="3761" /></li> 
</ul>

Answer 1

我认为问题是您使用了错误的事件。如果你使用“停止”，它就会起作用。在这里 fiddle :http://jsfiddle.net/jeYPJ/

$("#itemWrapper").sortable({stop: function(event, ui) {
    result = $("#itemWrapper").sortable("toArray");
     console.log(result.length);

}});

我认为，这与排序时触发更改事件有关:在这种情况下，它不会计算您正在排序的项目。