先添加Jquery扩展,然后直接$('#myTable').moveRow(4, 1);//此表示将第n+1行移动动第一行之后
JavaScript 代码:Jquery扩展复制
$.fn.extend({ moveRow: function(oldPosition, newPosition) { return this.each(function() { var row = $(this).find('tr').eq(oldPosition).remove(); $(this).find('tr').eq(newPosition).before(row); }); } });
HTML 代码:复制
<table id="myTable" cellpadding="5" cellspacing="1" bgcolor="#cccccc"> <tr align="center" bgcolor="#ffffff"> <td width="50">1</td> <td width="150">第1行</td> </tr> <tr align="center" bgcolor="#ffffff"> <td>2</td> <td>第2行</td> </tr> <tr align="center" bgcolor="#ffffff"> <td>3</td> <td>第3行</td> </tr> <tr align="center" bgcolor="#ffffff"> <td>4</td> <td>第4行</td> </tr> <tr align="center" bgcolor="#ffffff"> <td>5</td> <td>第5行</td> </tr> <tr align="center" bgcolor="#ffffff"> <td>6</td> <td>第6行</td> </tr> <tr align="center" bgcolor="#ffffff"> <td>7</td> <td>第7行</td> </tr> </table>
JavaScript 代码:复制
$('#myTable').moveRow(4, 1);//此表示将第n+1行移动动第一行之后