jquery - Jquery检查表行移动到顶部并返回未选中

Question

我对 JQuery 编程非常陌生，需要 JQuery 专家的帮助。我想要表格行中的 pin-able 功能。

设想：

1. 当我选中行中的复选框时，同一行移动到表格顶部。
2. 当我取消选中任何已选中的行时，移动到它被移动的同一个地方。

jsfiddle 演示：http: //jsfiddle.net/safkass/DhpBw/8/

Answer 1

可以使用一些清理，但这似乎工作（jsfiddle）：

$(document).ready(function () {
            $('#grid').tablesorter({ widgets: ['staticRow'] });
            $("input").click(function () {
                var row = $(this).parents("tr:first");
                if ($(this).is(':checked', true)) {
                    var firstRow = row.parent().find("tr:first").not(row);
                    var index = row.parent().find("tr").index(row);
                    row.addClass("TopRow");
                    row.insertBefore(firstRow).data("prevIndex", index);
                } else {
                    row.removeClass("TopRow");
                    var rows = row.parent().find("tr");
                    var newPos = $(rows[row.data("prevIndex")]);
                    if (newPos > 0) {
                        row.insertAfter(newPos);
                    }
                }
             });
        });​

Answer 2

这是我的小提琴：我相信它可以达到您想要的目的：

演示

即使在取消选中它们之前检查多行或全部时，这也有效。