jquery - 每次触发事件时更改所选元素的索引

Question

每次触发此事件时，我都会尝试增加所选 invoiceLine 元素的索引。我想知道是否有人可以向我展示一个简单的方法来做到这一点，如果它甚至可能的话，因为我是 JQuery 的新手并且在这方面遇到了非常困难的时间。

$invoiceLine.find('input').change(function(){
    $(this).parent().parent().next().find('div input').removeAttr('disabled');
});

Answer 1

如果通过索引表示元素在其兄弟元素中的位置，则可以使用许多 jQuery 方法轻松移动元素，例如 after()、before()、insertAfter()、insertBefore()、append()、appendTo() 等. 下面是一个简单的例子：

HTML：

<div class="invoiceLine">
    1 <input />
</div>
<div class="invoiceLine">
    2 <input />
</div>
<div class="invoiceLine">
    3 <input />
</div>

JS：

$('.invoiceLine').find('input').change(function() {
    var line = $(this).closest('.invoiceLine'); // find enclosing invoiceLine
    var next = line.next(); // find next invoiceLine
    if (next.length) // check that current line is not last
        line.insertAfter(next); // insert current line after the next one
});​​​​​​​​​​​​​​

小提琴：http: //jsfiddle.net/antishok/DteuU/