可排序的獲取元素索引

Question

我得到了這個HTML代碼：

<div id="pages">
    <div id="page1"></div>
    <div id="page2"></div>
    <div id="page3"></div>
    <div id="page4"></div>
</div>

僅出於測試目的，我想顯示對網格進行排序的元素索引：

$( "#pages" ).sortable({

    sort: function(event,ui){
        console.log($('#pages').index(ui.item));
    }
});

返回的索引是開始拖動時被拖動元素所在的索引。 如果我在停止/更新事件中移動代碼，則會收到正確的索引。 我的問題是，在拖動視覺通知（其他div之間的翻轉）時，索引又返回了另一個，我需要更改元素的css邊距。

拖動元素時如何獲得正確的順序？

TIA frgtv10

Answer 1

要訪問所拖動項目的當前索引，您需要使用ui.placeholder項目。

$( "#pages" ).sortable({
    helper: "clone",
    sort: function(event, ui) {
        console.log($(ui.placeholder).index());
    }
});