Chinaunix首页 | 论坛 | 博客
  • 博客访问: 460494
  • 博文数量: 141
  • 博客积分: 211
  • 博客等级: 入伍新兵
  • 技术积分: 1049
  • 用 户 组: 普通用户
  • 注册时间: 2010-09-17 16:25
个人简介

如此经年,望尽千帆。

文章分类

全部博文(141)

文章存档

2014年(73)

2013年(65)

2012年(3)

我的朋友

分类: JavaScript

2014-04-28 06:42:46

如何实现选中行、列合计示例 ,需要的朋友可以参考下

Jquery 方法 

  1. $(
  2. function () {
  3. //页面加载时计算人员统计表合计值
  4. calcSum();
  5. });
  6. //合计行计算
  7. /*
  8. 以合计行为中间变量
  9. 每个单元格与该列合计行相加
  10. 得到每列合计
  11. */
  12. function trVisible(chk, index) {
  13. var disValue = $("#Tr" + index).css("display");
  14. if (chk.checked) {
  15. $("#Tr" + index).css("display", "block");
  16. }
  17. else {
  18. $("#Tr" + index).css("display", "none");
  19. }
  20. calcSum();
  21. }
  22. function calcSum() {
  23. //合计行赋初始值0
  24. $("#trSum").each(function () {
  25. $(this).find("td").each(function () {
  26. if ($(this).index() != 0) {
  27. $(this).text("0");
  28. }
  29. });
  30. });
  31. $("#tabrytj").find("tr").each(function () {
  32. var trDis = $(this).css("display");
  33. //隐藏行不参与计算
  34. if (trDis == "block") {
  35. $(this).find("td").each(function () {
  36. var index = $(this).index();
  37. if (index >= 1) {
  38. var tdValue = $("#trSum").find("td:eq(" + index + ")").text();
  39. //totalSum += parseFloat($(this).text());
  40. $("#trSum").find("td:eq(" + index + ")").text(parseFloat(tdValue) + parseFloat($(this).text()));
  41. }
  42. });
  43. }
  44. });
  45. }
html语句 

  1. <table>
  2. <tr>
  3. <td>分公司</td>
  4. <td>
  5. <select>
  6. <option>
  7. 华南分公司
  8. </option>
  9. </select>
  10. </td>
  11. <td><input type="checkbox" onclick="trVisible(this,1)" name="chk1" id="chk1" checked="checked" />张1</td>
  12. <td><input type="checkbox" onclick="trVisible(this,2)" checked="checked" />张2</td>
  13. <td><input type="checkbox" onclick="trVisible(this,3)" checked="checked" />张3</td>
  14. <td><input type="checkbox" onclick="trVisible(this,4)" checked="checked" />张4</td>
  15. <td><input type="checkbox" onclick="trVisible(this,5)" checked="checked" />张5</td>
  16. <td><input type="checkbox" onclick="trVisible(this,6)" checked="checked" />张6</td>
  17. </tr>
  18. </table>
  19. <div> 
  20. <table border="0" class="tableinfo" id="tabrytj">
  21. <tr id="Tr1" style="display:block">
  22. <td>张1 </td>
  23. <td>124536</td>
  24. <td>124536</td>
  25. <td>124536</td>
  26. <td>124536</td>
  27. <td>124536</td>
  28. <td>124536</td>
  29. <td>124536</td>
  30. <td>124536</td>
  31. <td>124536</td>
  32. <td>124536</td>
  33. </tr>
  34. <tr id="Tr2" style="display:block">
  35. <td>张2 </td>
  36. <td>124536</td>
  37. <td>124536</td>
  38. <td>124536</td>
  39. <td>124536</td>
  40. <td>124536</td>
  41. <td>124536</td>
  42. <td>124536</td>
  43. <td>124536</td>
  44. <td>124536</td>
  45. <td>124536</td>
  46. </tr>
  47. <tr id="Tr3" style="display:block">
  48. <td>张23 </td>
  49. <td>124536</td>
  50. <td>124536</td>
  51. <td>124536</td>
  52. <td>124536</td>
  53. <td>124536</td>
  54. <td>124536</td>
  55. <td>124536</td>
  56. <td>124536</td>
  57. <td>124536</td>
  58. <td>124536</td>
  59. </tr>
  60. <tr id="trSum">
  61. <td></td>
  62. <td>0</td>
  63. <td>0</td>
  64. <td>0</td>
  65. <td>0</td>
  66. <td>0</td>
  67. <td>0</td>
  68. <td>0</td>
  69. <td>0</td>
  70. <td>0</td>
  71. <td>0</td>
  72. </tr>
  73. </table>
  74. </div>
阅读(912) | 评论(0) | 转发(0) |
给主人留下些什么吧!~~