使用 jQueryUI 删除时更新项目编号

Question

我有这个工作，有点，但只在第二次下降时更新数字，而不是第一次。我在这里做错了什么？

基本上尝试在使用拖放重新排序时更新“span.digit”。这样，数字就会更新以匹配列表中的新位置。我知道我快要让它发挥作用了——只是不确定我做错了什么。任何解释都会非常有帮助。谢谢！

$("#sortableQb2").droppable({
    drop: function(event, ui) {
        $('#sortableQb2 > li').each(function (i) {
            var humanNum = i + 1;
            $(this).find("span.digit").html(humanNum + '');
        });
    }
});

<ul id="sortableQb2">
    <li>
        <ul>
            <li>
                 <a href="#!" class="btn btn-link"><span class="digit">1</span>Some Item</a>
            </li>
            <li>
            </li>
        </ul>
    </li>
    <li>
        <ul>
            <li>
                 <a href="#!" class="btn btn-link"><span class="digit">2</span>Some Item</a>
            </li>
            <li>
            </li>
        </ul>
    </li>
    <li>
        <ul>
            <li>
                 <a href="#!" class="btn btn-link"><span class="digit">3</span>Some Item</a>
            </li>
            <li>
            </li>
        </ul>
    </li>
</ul>

小提琴：https://jsfiddle.net/o6t095h9/2/

Answer 1

我想通了……

$( function() {
    $( "#sortableQb2" ).sortable({
        update: function( event, ui ) {
            $('#sortableQb2 > li > ul > li > a > span.digit').each(function (i) {
                var humanNum = i + 1;
                $(this).html(humanNum + '');
            });
        }
    });
});

小提琴：https://jsfiddle.net/o6t095h9/3/