无法附加到正确的位置

时间:2014-10-16 22:26:45

标签: jquery

我正在尝试附加一些HTML,以便我的表格将使用tablesorter进行排序。目前,如果您点击表格信息的第一行,表格正在排序,我希望观众能够点击捐赠总额进行排序。 。 。请看演示,看看我的意思: http://jsfiddle.net/jelane20/kt8jzg9e/8/

如果您查看演示,请点击捐赠总计没有任何反应,如果您点击捐赠总额下第一行的金额,那么它会进行排序。

<table width="100%" bgcolor="#003399" cellspacing="0" cellpadding="1" border="0">
  <tbody><tr><td>
    <table width="100%" bgcolor="#FFFFFF" cellspacing="0" cellpadding="2" border="0">
      <tbody>
         <tr bgcolor="#003399">
            <td colspan="4" class="white"><b>Click on the Group for more information: </b></td>
         </tr>
         <tr bgcolor="#eeeeee">
             <td>&nbsp;</td>
             <td><b>Group Name</b></td>
             <td><b>Group Captain</b></td>
             <td><b>Donation Total</b></td>
         </tr>
         <tr bgcolor="#ffffff">
           <td></td>
           <td><a href="#">test1</a></td><td>test test</td>
           <td>$20.00</td>
         </tr>
         <tr bgcolor="#eeeeee">
          <td></td>
          <td><a href="#">test2</a></td>
          <td>test test</td>
          <td>$50.00</td>
         </tr>
         <tr bgcolor="#eeeeee">
          <td></td>
          <td><a href="#">test3</a></td>
          <td>test test</td>
          <td>$30.00</td>
         </tr>
      </tbody>
     </table>
    </td>
   </tr>
 </tbody>
</table>

这是脚本。 。

var $existTable= $('table td table');

var $newTable = $('<table id="newTable"><thead></thead><tbody></tbody></table>');
$newTable.find('thead').append($existTable.find('tr').eq(2));
$newTable.find('tbody').append($existTable.find('tr:gt(1)'));
$existTable.parent().append( $newTable );


$newTable.tablesorter();

如果你看小提琴,这会更有意义 - http://jsfiddle.net/jelane20/kt8jzg9e/8/

非常感谢你!

1 个答案:

答案 0 :(得分:0)

JSFIDDLE这就是你想要的吗?

JS CODE

var $existTable= $('table td table');
var $newTable = $('<table id="newTable"><thead></thead><tbody></tbody></table>');
$newTable.find('thead').append($existTable.find('tr').eq(1));
$newTable.find('tbody').append($existTable.find('tr:gt(0)'));
$existTable.parent().append( $newTable );
$newTable.tablesorter();