Question

有一个表格，用户可以选择多行以下，有两个按钮“向上”和“向下”。如果用户单击“向下”，则所选行应向下一行，“向上”相同，所选行应向上移动一行，用户可以选择任何行。

下面是我的jQuery代码。

对于“向下”

$(".moveDown").live("click", function(){
    var row = $("#pageDefTable .selectRow");

    row.each(function() {
        var $this=$(this);
        $this.insertAfter($this.next());
    });     

    return false;
});

对于“up”

$(".moveUp").live("click", function() {
    var row = $("#pageDefTable .selectRow");

    row.each(function() {
        var $this=$(this);
        $this.insertBefore($this.prev());
    });

    return false;
});

但它没有正常工作。当我选择最上面的两行并单击它时，它不起作用。同样，如果我选择最后两行并点击它就不起作用。

您的建议和帮助将不胜感激。

嗨Damian，你提供的解决方案在正常情况下工作正常。我还有一个案例..我在下面解释，左右两个表格＆gt;用户可以从左表中选择任何行（id = metricTable）并可以移到右表（id = pageDefTable），它最后会附加到表中，并在右表中显示为选定行。

下面是从左表到右表中选择任何行的代码

        $("#center .move-row").live("click", function() {
            var tr = $("#metricTable .selectRow").remove().clone();
            $("#pageDefTable tbody").append(tr);
        return false;
        });

右表是具有向上移动和向下移动功能的表，在从左到右移动任何行之后，我点击了移动按钮，它不移动行，当我第二次点击它时消失。

请任何帮助和建议???

Answer 1

我没有看到moveUp的问题。在moveDown上，您需要反转项目的顺序：

$($('tr.selected').get().reverse()).each(function () {
    if ($(this).next()) {
        $(this).insertAfter($(this).next());   
    }
})

jsfiddle

在html表Jquery中向下移动行

1 个答案: