javascript - Change input value depending on list order in jQuery

Question

I asked a question yesterday which I realise didn't really make much sense, so I have made it a lot simpler hopefully now!

I have an unordered list

<ul id="itemlist">
<li>item 1 <input type="hidden" name="slide-order[]" value="slide[]" /></li>
<li>item 2 <input type="hidden" name="slide-order[]" value="slide[]" /></li>
</ul>

And this sortable script

$("#itemlist").sortable({
    change: function(event, ui){

         var sort = $('#itemlist').find('input');

         sort.each(function(index){
            $(this).val((index + 1));
         });
    }
});

What I need is for the value to always stay in order 1,2,3,4 etc when moving the list items around. So even if item 2 was moved to the top, the value would become 1.

I have tried various methods but nothing seems to be working :/

Answer 1

像这样的东西？

$("#itemlist").sortable({
    stop: function(event, ui){
        var cnt = 1;
        $(this).children('li').each(function(){
            $(this).children('input').val("slide["+cnt+"]");
            cnt++;
        });
    }
});

演示

Answer 2

尝试这个

var sort = $('#itemlist').find('input');
sort.each(function(){
    var index = $(this).index();
    $(this).val((index + 1));
});