定義索引 <li> 元素在 <ul> jQuery排序后列出

Question

希望您能為我解決一點問題。 用我的代碼，我想重命名我的ul列表的元素ID，這些元素ID按可排序的jquery排序，但不能正常工作。 有時它可以正常工作，但有時只是一個錯誤：“ Uncaught TypeError：無法讀取null的屬性'id'”，它的重命名為：1-2-3-4-5-6-6-8。也許您可以幫助我出來。

這是我的ul：

<ul class="example">
    <li id="1" class="example"></li>
    <li id="2" class="example"></li>
    <li id="3" class="example"></li>
    <li id="4" class="example"></li>
    <li id="5" class="example"></li>
    <li id="6" class="example"></li>
</ul>

用於可排序的js的js：

$('.example').sortable();

這是我的js，用於獲取實際索引並重命名li id：

function myFunction(){
    var lenght = $(".example").length;
    lenght = lenght -1;

    for (var i=1; i<=lenght; i++){
        var newIn = $('#'+i).index();
        newIn = newIn +1;
        var inold = document.getElementById(i).id;


    if(newIn != inold){
        var change = document.getElementById(i).id = newIn;
        }
    }
}

謝謝你給我一個提示！

Answer 1

感謝您的提示CBroe！ 它的工作就像一個魅力！

    function myFunction(){
$(".example").each(function(i) {
    var row = $(this)
    row.attr('id', '' + i);
});
}

Answer 2

當您有重復ID的列表或沒有連續ID的like（3,2,4,1,6）時出現此錯誤，這里'5'丟失了，而您只是通過訪問序列號'i'來替換ID當我到達5時，“ document.getElementById（i）.id”將給您“ -1”，因為沒有li = 5的鋰。 我希望這段代碼對您的問題有所幫助。

function myfunction(){
$("li.example").each(function() {
        var currentId = $(this).attr("id"); //id of each li
        var newIn = $(this).index(); //index of each li starts from 0
        newIn++;
        if(currentId!==newIn)
        {
            $(this).attr("id",newIn);
        }
    });
}