jquery - 如何使用jquery将行移动到最顶部或底部

Question

我正在尝试使用 jquery 操作左、右、非常高、非常低的表格

在我的 JavaScript 中，我有：

row = $(this).parents("tr:first");
        if ($(this).is(".icon-arrow-up")) {
          row.insertBefore(row.prev());
        }
        if ($(this).is(".icon-arrow-down")) {
          row.insertAfter(row.next());
        }
        if ($(this).is(".icon-arrow-left")) {
          row.insertAfter;
        }
        if ($(this).is(".icon-arrow-right")) {
          return row.insertBefore;

在我的html中：

<div id="arrangevideos" class="modal hide fade" aria-hidden="true">
    <table class="table">
        <thead>
            <tr>
                <th>Isrc</th>
            </tr>
        </thead>
        <tbody>
            <tr ng-animate="'table-anim'" ng-repeat="isrc in videolist track by $index">
                @*<tr ng-animate="'table-anim'" ng-repeat="isrc in videolist">*@
                <td>{{isrc}}</td>
                <td>
                    <i class="icon-arrow-left"></i>
                    <i class="icon-arrow-up"></i>
                    <i class="icon-arrow-down"></i>
                    <i class="icon-arrow-right"></i>
                </td>
            </tr>
        </tbody>
    </table>
    <button type="button" class="btn btn-danger" data-dismiss="modal" aria-hidden="true">Close</button>


</div>

向上和向下箭头工作得非常好，但我似乎无法使用 icon-arrow-left 和 icon-arrow-right 将一行移动到最顶部或最底部。

这里有什么问题？

Answer 1

弄清楚你想要什么有点困难，但我很确定就是这样：

小提琴

$(document).on('click', 'i', function () {
    row = $(this).parents("tr:first");
    if ($(this).is(".icon-arrow-up")) {
        row.insertBefore(row.prev());
    }
    if ($(this).is(".icon-arrow-down")) {
        row.insertAfter(row.next());
    }
    if ($(this).is(".icon-arrow-left")) {
        $(this).parents('tbody').prepend(row);
    }
    if ($(this).is(".icon-arrow-right")) {
        $(this).parents('tbody').append(row);
    }
});