我正在使用javascript函数insertAfter和insertBefore,但是我正在尝试insertAfter和insertBefore 2元素。
例如,请考虑以下HTML
<table>
<tbody>
<tr>
<td>
Item 1
</td>
<td>
<div class="moveUpDown">
<div class="up">
</div>
<div class="down">
</div>
<div>
</div>
</div>
</td>
</tr>
<tr>
<td colspan="2">
<table>
<tr>
<td>
1
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td>
Item 2
</td>
<td>
<div class="moveUpDown">
<div class="up">
</div>
<div class="down">
</div>
<div>
</div>
</div>
</td>
</tr>
<tr>
<td colspan="2">
<table>
<tr>
<td>
1
</td>
</tr>
</table>
</td>
</tr>
</table>
然后我有这个javascript代码段
var row = $(this).parents("tr:first");
if ($(this).is(".up")) {
row.insertBefore(row.prev());
} else {
row.insertAfter(row.next());
}
基本上,当调用Up类时,前一行向上移动,当调用Down类时,当前行向下移动一行。
我想要做的是将行向上/向下移动2行...意思是像row.prev()。prev()或row.next()。next()然而这似乎不起作用
有一个简单的方法吗?
谢谢,非常感谢任何帮助/建议。
答案 0 :(得分:2)
上去
row.prev().prev().before(row)
下去
row.next().next().after(row)
显然tr必须存在prev / next必须存在
请注意,您将行缓存为第一个tr元素,因此每次第一个tr元素更改时行都会更改
听取事件
$("table").on("click","tr > td > span.moveup", function() {
var row = $(this).parent().parent();
if (row.prev().prev().get(0)) row.prev().prev().before(row)
})