Javascript jQuery移动表行'；输入并更改id/名称

我需要有按钮来上下移动表格行，输入在里面。 在移动中，我需要保证输入的名称和id都已更改 关于他们的新职位

我在JSFIDLE上尝试过，但无法使其工作：

例如，我已经将第一行下移，有四个更改：

        <input type="text" id="id_1" name="id_1"/>
        <input type="text" id="test_1" name="test_1"/>

需要成为

        <input type="text" id="id_2" name="id_2"/>
        <input type="text" id="test_2" name="test_2"/>

但是值需要保持不变，只需更改id/名称即可

这只是一个测试示例，在生产环境中，我有大约20个输入 每行

---

希望有人能提供帮助。

试试这个：重新排列行后，调用一个函数，该函数将为输入字段重新分配id和名称

$(document).ready(function(){
    $(".up,.down").click(function(){
        var row = $(this).parents("tr:first");
        if ($(this).is(".up")) {
            row.insertBefore(row.prev());
        } else {
            row.insertAfter(row.next());
        }
        reAssignIdAndName();
    });

    reAssignIdAndName = function(){
        $('table tr').each(function(index){
            $(this).find('td:eq(2) input').each(function(){
            //id of input element
            var id = $(this).attr('id');
            //get index of underscrore
            var underScoreIndex = id.indexOf('_');
            //take id till underscore and append your index+1 value
            id = id.substring(0,underScoreIndex+1)+(parseInt(index)+1);
            //assigne new id and name
            $(this).attr('id',id); 
            $(this).attr('name',id);                
            });
        });
    };
});

---

此操作有效，并仅为移动的两行重新分配位置：

jQuery(document).ready(function($){
$(".up,.down").click(function(){
    var $this = $(this),
        row = $this.parents("tr:first");

    if ($this.is(".up")) {
        if (row.parent().find("tr:first").get(0) !== row.get(0)) {
            reAssignPosition(row.prev().find('input'));
            row.insertBefore(row.prev());
            reAssignPosition(row.find('input'), true);
        }
    } else {
        if (row.parent().find("tr:last").get(0) !== row.get(0)) {
            reAssignPosition(row.next().find('input'), true);
            row.insertAfter(row.next());
            reAssignPosition(row.find('input'));
        }
    }
});

function reAssignPosition($elt, up) {
    var $row = $elt.parents("tr:first"),
        oldPosition = parseInt($row.find('input').attr('id').replace(/(id|test)_/, '')),
        newPosition, newId, newName, input = $row.find('input');    
    if (up) newPosition = oldPosition - 1;
    else newPosition = oldPosition + 1;
    $elt.each(function() {
        this.id = this.id.replace(/(id|test)_(.*)/, "$1_" + (newPosition));
        this.name = this.name.replace(/(id|test)_(.*)/, "$1_" + (newPosition));
    });
}

}))

---

不过，我相信可以进行一些重构。

使用

$（this.parent（）.parent（）.index（）获取您单击的行的索引如果单击“向上”，则执行
index++
否则
index--
然后将控件的id和名称替换为
var id=control.attr（“id”）.split（“”）；control.attr（“id”，id+“”+索引）.attr（“name”，id+“”+索引）