javascript - 在 JQuery 中获取拖动项的位置

Question

将项目拖到新位置时，我想输出项目的新位置。例如

列 = 1 位置= 3

表示小部件已移至第一个列的第 3 列。

我正在使用这个脚本 http://net.tutsplus.com/tutorials/javascript-ajax/inettuts/

我认为把它放在下面的位置是最好的。但是我试过了 ui.item.index 以获得新位置，这只是给我值 - 1 而不是被拖动对象的位置。有什么想法吗？

$(settings.columns).sortable({
    items: $sortableItems,
    connectWith: $(settings.columns),
    handle: settings.handleSelector,
    placeholder: 'widget-placeholder',
    forcePlaceholderSize: true,
    revert: 300,
    delay: 100,
    opacity: 0.8,
    containment: 'document',
    start: function (e,ui) {
        $(ui.helper).addClass('dragging');
    },

    stop: function (e,ui) {
        alert("New position: " + ui.item.index());
        $(ui.item).css({width:''}).removeClass('dragging');
        $(settings.columns).sortable('enable');
    }
});

Answer 1

查看 nettuts 站点上的演示:Demo

ui.item 已经是一个 jQuery 对象，因此您可以这样引用它。

列的从 0 开始的索引位置:

ui.item.parent().parent().children().index(ui.item.parent())

item 的从 0 开始的索引位置:

ui.item.parent().children().index(ui.item);

因此，如果您要在第一列的“Welcome to iNettuts”下面拖动一个项目，上面的代码将为该列(即第一列)返回 0 和 1 用于项目位置(因此列中的第二个项目)