jquery求和

这个方法的优点是待统计的对象和存结果的对象可以在页面的任意位置,只要具有相同的自定义组号就行。

将要统计的所有对象都加上自定义属性"待统计组",并给它个自定义编号

<td 待统计组="1">111</td>
<p 待统计组="1">222</p>

将要保存结果的所有对象加上自定义属性"汇总组",并给它个编号。则这个对象会统计所有含自定义属性 待统计组="1" 的对象的text的和。

<td 汇总组="1">这里是求和结果会被替换成333</td>
<p 汇总组="1">这里是求和结果会被替换成333</p>
<h3>将这段代码保存成html文件打开看看</h3>
<script src="https://lf6-cdn-tos.bytecdntp.com/cdn/expire-1-M/jquery/3.5.1/jquery.min.js"></script>

<table border="1">
  <thead>
    <tr>
      <td>行号</td>
      <td>有自定义属性 统计组=1的格子</td>
      <td>有自定义属性 统计组=2的格子</td>
      <td>有自定义属性 统计组=3的格子</td>
    </tr>
  </thead>
  <tr>
    <td>1</td>
    <td 待统计组="1">111</td>
    <td 待统计组="2">222</td>
    <td 待统计组="3">333</td>
  </tr>
  <tr>
    <td>2</td>
    <td 待统计组="1">111</td>
    <td 待统计组="2">222</td>
    <td 待统计组="3">333</td>
  </tr>
  <tfoot>
    <tr>
      <td>汇总行</td>
      <td 汇总组="1">这里是求和结果会被替换成222</td>
      <td 汇总组="2">这里是求和结果会被替换成444</td>
      <td 汇总组="3">这里是求和结果会被替换成1666(后面有1个p也存了1000)</td>
    </tr>
  </tfoot>
</table>

即便放在p里面也可以统计
<p 待统计组="3">1000</p>

<script>
  $(document).ready(function() {
    $("[汇总组]").each(function() {
      var 汇总组号 = $(this).attr('汇总组');
      var 汇总组号_sum = 0;
      $("[待统计组='" + 汇总组号 + "']").each(function() {
        var this_float = parseFloat($(this).text());
        if (!isNaN(this_float)) {
          汇总组号_sum += this_float;
        }
      });
      console.log("组号=" + 汇总组号 + ', 和=' + 汇总组号_sum);
      $(this).text(汇总组号_sum);
    })
  });
</script>
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 这些是C#和ASP.NET数据库面试题,全部从网上收集而来,经整理而发表,希望给大家带来帮助,有错误的地方还请各位...
    itming阅读 4,290评论 1 9
  • . 简述 private、 protected、 public、 internal 修饰符的访问权限。 答 . p...
    上岸666阅读 3,660评论 0 0
  • 1. 简述private、protected、public、internal 修饰符的访问权限。 答. priva...
    是朱朱呀阅读 4,385评论 0 8
  • 1、C#中 property 与 attribute的区别,他们各有什么用处,这种机制的好处在哪里? proper...
    胤醚貔貅阅读 10,440评论 0 7
  • Java基础 类加载的时机和类初始化的时机(引出tomcat类加载器)JVM和绝大多数用户自定义的类在JVM启动的...
    fanyank阅读 6,754评论 0 33