标题 | 用Jquery选择器计算table中的某一列某一行的合计 |
内容 | 利用Jquery选择器,计算table中的某一列,某一行的合计,非常方便。下面以计算行合计为例: 核心算法: view sourceprint?1 $('#tableId tr').each(function() { 2 $(this).find('td:eq(columnIndex)').each(function() { 3 totalAmount += parseFloat($(this).text()); 4 }) 5 }); 下面是案例代码 view sourceprint?01 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 02 <html xmlns="http://www.w3.org/1999/xhtml"> 03 <head> 04 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 05 <title>Jquery计算table行合计</title> 06 <script id="jquery_183" type="text/javascript" src="http://runjs.cn/js/sandbox/jquery/jquery-1.8.3.min.js"></script> 07 <script type="text/javascript"> 08 $(document).ready(function() { 09 10 var totalRow = 0 11 $('#mytable tr').each(function() { 12 $(this).find('td:eq(2)').each(function(){ 13 totalRow += parseFloat($(this).text()); 14 }); 15 }); 16 17 $('#totalRow').append('<td>合计</td><td></td><td>'+totalRow+'</td><td></td>'); 18 }); 19 </script> 20 21 </head> 22 <body> 23 <table id="mytable" width="37%"> 24 <thead> 25 </thead> 26 <tr> 27 <td width="63" >11</td> 28 <td width="68" >12</td> 29 <td width="62" >13</td> 30 <td width="75" >14</td> 31 </tr> 32 <tr> 33 <td width="63" >21</td> 34 <td width="68" >22</td> 35 <td width="62" >23</td> 36 <td width="75" >24</td> 37 </tr> 38 <tr id="totalRow"></tr> 39 </table> 40 </body> 41 </html> 效果图: ![]() |
随便看 |
|
在线学习网考试资料包含高考、自考、专升本考试、人事考试、公务员考试、大学生村官考试、特岗教师招聘考试、事业单位招聘考试、企业人才招聘、银行招聘、教师招聘、农村信用社招聘、各类资格证书考试等各类考试资料。