Question

我正在尝试弄清楚如何使用文本框值重新排序ul。

以ul ....

开头

<ul id="ItemList">
    <li> <some text>  <input id="Text1" type="text" value="1" /></li>
    <li> <some text>  <input id="Text2" type="text" value="2" /></li>
    <li> <some text>  <input id="Text3" type="text" value="3" /></li>
    <li> <some text>  <input id="Text4" type="text" value="4" /></li>
</ul>

然后，如果我将Text4的值从4更改为2，则列表会在更改text2＆amp;的值时重新排序。 3至3＆amp;分别为4。

我怀疑我不是第一个必须这样做的人，所以如果有指针可用的话。

我在这里找不到任何具体内容，但我可能不会正确搜索。

Answer 1

这是一种快速的方法（没有错误检查）：

$('input').keyup(function () {
    var start = $(this).index('input');
    var target = $(this).val() - 1;
    if (target < start) $(this).parent().insertBefore($('li').eq($(this).val() - 1));
    if (target > start) $(this).parent().insertAfter($('li').eq($(this).val() - 1));
});

<强> jsFiddle example

请注意，您希望在更改后对输入重新编号，将此行添加到函数$('input').each(function(){$(this).val($(this).index('input')+1)});的末尾

jQuery - 通过更改文本框值重新排序列表

1 个答案: