从 Jquery UI Sortable 中删除项目

我试图找出从 JQuery UI 可排序列表中删除项目的正确方法。我创建了一个 JSfiddle 来说明我的问题。

基本上，我有几个围绕 JQuery UI 可排序小部件的回调，并且我希望在从小部件中删除元素后立即执行这些回调。这样做的正确方法是什么？因为“$.remove”和“$.detach”似乎都有效。

编辑1：我不是在寻找解决我的问题的修补程序，而是更多地解释 JQuery UI 可排序列表如何工作，而下面的答案清楚地解决了问题。我认为这不是一种干净的做法。我认为 JQuery UI Sortable 应该意识到，当您从列表中删除两个元素之间的元素时，您应该需要重新排序

如果您注意到下面的内容，当我在元素上调用删除时，该函数不会被执行。

$(document).ready(function(){
    $('ul').sortable({
        stop: function(event, ui) {
            updatePosition();
        }
    });

    $('.remove').on('click', function(e){
        $(".delete").remove();
    });
});

function updatePosition(){
    $('ul li').each(function(i){
        $(this).html(i + 1);
    });
}

http://jsfiddle.net/72RTz/2/ http://jsfiddle.net/72RTz/2/

在您的删除事件处理程序中，只需包含对updatePosition after $(".delete").remove();这不会涵盖任何时候从列表中删除元素的情况：如果这确实是您的意图，那么您将不得不使用类似 @pmich35 的内容answer https://stackoverflow.com/a/19553606/1727159（虽然这确实意味着updatePosition每个都会被调用$.remove从那时起，调用，无论是否在列表中的任何元素 - 有点矫枉过正）

Your 更新了小提琴 http://jsfiddle.net/72RTz/6/.

EDIT:目前没有“删除”事件$.sortable适合您的目的 - 那里的删除事件仅涵盖用户将列表项从列表拖动到另一个可排序列表的特定情况。Sortable实际上并不总是跟踪您的列表项 - 它不关心您是否以编程方式添加或删除项目 -它仅促进用户拖动事件。它实际上并不执行任何“排序”，所有出现的排序都只是 jQuery 拉取 DOM 元素以形成其对象的方式（如果您将列表项缓存在 jQuery 对象中，然后对这些项进行拖动排序，缓存的列表项的顺序将与以前相同）。由于“排序”只是函数的幻觉，因此它“无法”主动跟踪追加/删除。

还有另一种可能的解决方法：附加updatePosition to the ul元素本身：

$( 'ul' ).on( 'remove', 'li', updatePosition );

这也实现了您的目标，但仍然不是您想要的“干净”方式。一般元素上的“删除”事件是在 jQuery UI 1.10.3 中添加的（因此 jsfiddle 不会覆盖它，它们只会上升到 1.9.2），并且会调用updatePosition每当任何电流或未来列表项被删除（从 DOM 中 - 拖动的删除仍然被捕获$.sortable的删除事件）。