Question

我有下一个结构：

<div class="container">
   <div class="block">
      <div class="id">1</div>
      <div class="date">02/21/2015</div>
      <div class="value">111</div>
   </div>
   <div class="block">
      <div class="id">1</div>
      <div class="date">02/21/2015</div>
      <div class="value">222</div>
   </div>
   <div class="block">
      <div class="id">1</div>
      <div class="date">02/30/2015</div>
      <div class="value">333</div>
   </div>
   <div class="block">
      <div class="id">1</div>
      <div class="date">02/30/2015</div>
      <div class="value">444</div>
   </div>
   <div class="block">
      <div class="id">2</div>
      <div class="date">05/17/2015</div>
      <div class="value">555</div>
   </div>
</div>

我需要对它进行分组并计算值，然后我需要在我的页面中打印它。步骤进行：

按 ID
分组日期（在ID中）
计算值（在每个日期中）

所以，结果：

<div class="container">
   <div class="block">
      <div class="id">1</div>
      <div class="date">02/21/2015</div>
      <div class="value">333</div> <!-- 111+222 -->
   </div>
   <div class="block">
      <div class="id">1</div>
      <div class="date">02/30/2015</div>
      <div class="value">777</div> <!-- 333+444 -->
   </div>
   <div class="block">
      <div class="id">2</div>
      <div class="date">05/17/2015</div>
      <div class="value">555</div>
   </div>
</div>

P.S。当然，我不需要评论。：）

你能帮我解决JS / jQ代码吗？

Answer 1

这是单向(demo)：

var $container = $('.container'),
    $blocks = $container.find('.block'),
    results = {},
    output = '';

$blocks.each(function () {
    var $this = $(this),
        id = $this.find('.id').html(),
        date = $this.find('.date').html(),
        value = $this.find('.value').html();

    results[id] = results[id] || {};
    results[id][date] = results[id][date] || 0;
    results[id][date] += parseInt(value);
});

$.each(results, function (id, dates) {
    $.each(dates, function (date, value) {

    output += '<div class="block">' +
      '<div class="id">' + id + '</div>' +
      '<div class="date">' + date + '</div>' +
      '<div class="value">' + value + '</div>' +
   '</div>';

    });
});

$container.html(output);

如何对div进行分组并计算值？

1 个答案: