Question

我正在使用此jquery数据表plugin来显示数据库中的信息。我的表看起来如下。现在我想总结这些标记（请查看下表）并将它们显示为总标记，就像在此website

中给出的示例一样

<script type="text/javascript" src="js/jquery.dataTables.min.js"></script>
<script type="text/javascript" charset="utf-8">
 $(document).ready(function() {$('#gtable').dataTable();} );
  </script>

<table class="gtable" align="center" id="gtable">
<thead>
 <tr>
    <th>Sl</th>
    <th>Name</th>
    <th>Marks</th>
 </tr>
</thead>

<tbody>
 <tr><td>1</td> <td>Charlie Sheen</td>  <td>20</td></tr>
 <tr><td>2</td> <td>John Cryer</td>     <td>20</td></tr>
 <tr><td>3</td> <td>Jason Stathum</td>  <td>20</td></tr>

</tbody>

</table

该插件的网站提供了以下代码并显示总结但我仍然不明白如何使用它上面的数据表。

你能帮帮我吗？

  $(document).ready(function() {
  $('#example').dataTable( {
    "fnFooterCallback": function ( nRow, aaData, iStart, iEnd, aiDisplay ) {
        /*
         * Calculate the total market share for all browsers in 
          this table (ie inc. outside
         * the pagination)
         */
        var iTotalMarket = 0;
        for ( var i=0 ; i<aaData.length ; i++ )
        {
            iTotalMarket += aaData[i][4]*1;
        }

         /* Calculate the market share for browsers on this page */
        var iPageMarket = 0;
        for ( var i=iStart ; i<iEnd ; i++ )
        {
            iPageMarket += aaData[ aiDisplay[i] ][4]*1;
        }

        /* Modify the footer row to match what we want */
        var nCells = nRow.getElementsByTagName('th');
        nCells[1].innerHTML = parseInt(iPageMarket * 100)/100 +
            '% ('+ parseInt(iTotalMarket * 100)/100 +'% total)';
     }
   } );
  } );

Answer 1

该功能应该是这样的

$('#example').dataTable( {
  "fnFooterCallback": function ( nRow, aaData, iStart, iEnd, aiDisplay ) {

    var TotalMarks = 0;
    for ( var i=0 ; i<aaData.length ; i++ )
    {
        TotalMarks += aaData[i][2]*1;
    }

    var nCells = nRow.getElementsByTagName('th');
    nCells[1].innerHTML = TotalMarks;
  }
});

希望这会有所帮助。

Answer 2

非常简单：

var sum = 0;
$("#gtable tbody tr").each(function(){
    sum += $(this).find("td").eq(3).text();
});

未经测试，告诉我你是否有问题。

说明：这里基本上是我们初始化$.each范围之外的变量'sum'，jQuery每个都允许你遍历所有匹配条件的元素，在这种情况下，表体属于表中的所有表行到#gtable，比我们做什么，我们在每一行中找到第三个td，并将其添加到总和中，因为JavaScript是一种动态类型语言 - 可以这样做。

现在在变量'sum'中我们有所有的标记求和。

Jquery表插件中的值的总和

2 个答案: