Jquery移动表行但不超过表头

我有上下移动的表行，但我的问题是数据表行替换了表头（第一行）

我想要一个固定的第一行，这样当您单击向上箭头时，您不会向上移动该行以替换标题

我尝试了一些条件逻辑来检查当前行是否是表的第一行，但它不起作用

$(document).ready(function(){

<!--- Move: click to move rows up or down --->
$(".up,.down").click(function(){
var row = $(this).parents("tr:first");

<!-- this var does not work -->
var firstrow = $('table')[0].rows[0]; 

<!-- Check that is not the first row NEEDS FIXED -->
if (row != firstrow){

if ($(this).is(".up")) {
row.insertBefore(row.prev());
} else {
row.insertAfter(row.next());
}
}
});
});

<table>
<tr>
<td>Do Not Replace Me</td>
<td >&nbsp;</td>
</tr>
<tr>
<td>Two</td>
<td>
<a href="#" class="up">Up</a>
<a href="#" class="down">Down</a>
</td>
</tr>
<tr>
<td>Three</td>
<td>
<a href="#" class="up">Up</a>
<a href="#" class="down">Down</a>
</td>
</tr>
</table>

$（文档）.ready（函数（）{
$（“.up，.down”）。单击（函数（）{
var行=$（this）.parents（“tr:first”）；
var firstrow=$（'table'）[0]。行[0]；
如果（行！=第一行）{
如果（$（this）.is（“.up”））{
row.insertBefore（row.prev（））；
}否则{
row.insertAfter（row.next（））；
}
}
});
});
不要代替我
两个
三

桌子必须保持原样，我不能把td改成th或类似的东西

---

我希望有一种方法可以修复这两行代码。

jQuery

index

函数应该在这里有所帮助

$(".up, .down").click(function() {
    // get parent tr
    var $row = $(this).parents('tr:first');
    var $link = $(this);
    // count all tr
    var count = $('table tr').length;
    // if tr isn't the first
    if($row.index() !== 0) {
        // if direction is up and there is a tr above
        if($link.hasClass('up') && $row.index() > 1) {
            $row.insertBefore($row.prev());
        } 
        // if direction is down and there is a tr below
        else if($link.hasClass('down') && $row.index() < count - 1) {
            $row.insertAfter($row.next());
        }
    }
});

$（“.up，.down”）。单击（函数（）{
//获取父tr
var$row=$（this.parents（'tr:first'）；
var$link=$（此）；
//计算所有tr
变量计数=$（'table tr'）。长度；
//如果tr不是第一个
如果（$row.index（）！==0）{
//如果方向向上，且上面有tr
如果（$link.hasClass（'up'）&&$row.index（）>1）{
$row.insertBefore（$row.prev（））；
} 
//如果方向向下，且下方有tr
else if（$link.hasClass（'down'）&&$row.index（）

我想您应该知道（鉴于您的免责声明，html必须“保持原样…”），如果您可以将标题/第一行放入

thead

元素，将其余的放入

tbody

，那么这将更加容易，但有一种方法可以处理html“原样”：

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

    var firstrow = $('table tr:first');

    if ($(this).is(".up") && row.prevAll().length > 1) {
        row.insertBefore(row.prev());
    }
    else if ($(this).is(".down") && row.nextAll().length > 0) {
        row.insertAfter(row.next());
    }
    else {
        return false;
    }
});

顺便说一句，您的脚本可能在注释中产生了错误（尽管我怀疑添加注释是为了我们的利益，而不是在您的实际JavaScript中）：

或：

参考资料：

---

我最近遇到了一个类似的问题，我的行在表中的“标题”行上方移动

我在jquery中使用一个基本类调用解决了这个问题，并将该类分配给表。这只是向元素规范添加了另一个深度级别，以便忽略不符合要求的表行

试试这个：

var行=$（this）.parents（“tr.MoveableRow:first”）

然后添加到每个标记，class=“MoveableRow”

---

例：

是的，使用thead会更容易，但这就是问题所在。是的，这些评论只是一个例子。我不确定代码块将如何显示它们。Stackoverflow的第一个职位。无论如何，谢谢你的周到和彻底。

<!-- comment text -->

// single-line comment
// which needs to have the double-slash
// preface each comment-line...

/* This is a multi-line
   comment, and this text
   will happily remain commented-out
   until you get to
   one of these comment-close things, just to the right -> */