Question

我正在创建一个包含Parent和Child任务的任务列表。它们布置在有序列表中并且嵌套在很多级别，因此父任务也可以包含子任务和父任务。

示例：

    <div class="item-list">
    <ol>
     <li class="parent">
        <div class="title">Im a task</div>
        <div class="totalhours">total child hours here please</div>
        <ol>
          <li>
            <div class="title">Im a task</div>
            <div class="hours">5</div>
          </li>
          <li>
            <div class="title">Im a task</div>
            <div class="hours">10</div>
          </li>
          <li class="parent">
           <div class="title">Im a task</div>
           <div class="totalhours">total child hours here please</div>
           <ol>
             <li>
               <div class="title">Im a task</div>
               <div class="hours">5</div>
             </li>
             <li>
               <div class="title">Im a task</div>
               <div class="hours">10</div>
             </li>
          </ol>
         </li>
        </ol>
     </li>
     <li>Another task thats not a parent on this level</li>
    </ol>
    </div>

所以每个级别我都想拥有所有嵌套项目。因此，最顶层的父任务包括所有嵌套小时div的小时数，然后如果您向下钻取它，则每个嵌套父级在其所有嵌套小时内执行相同操作，依此类推。

这就是我现在正在使用它并且它只是计算每个小时div而不是仅嵌套并且在任何地方放置相同的数字。

    var totalest = $('li.parent .totalhours');

    var sum = 0;

    $("li .hours").each(function() {
        var val = $.trim( $(this).text() );

        if ( val ) {
            val = parseFloat( val.replace( /^\$/, "" ) );

            sum += !isNaN( val ) ? val : 0;
        }

        totalest.html(sum); 
    });

我希望得到这个结果

我是一个30小时的家长任务
- 我是一个任务5小时
- 我是一个任务10小时
- 我是父母的任务15个小时
  - 我是一个任务5小时
  - 我是一个任务10小时
我是另一个20小时的父任务
- 我是一个任务5小时
- 我是一个任务5小时
- 我是一个10小时的父任务
  - 我是一个任务5小时
  - 我是一个任务5小时

Answer 1

遍历每个父级并仅将小时数添加到该父级。

$(".parent").each(function() {
  var sum = 0;
  $(".hours", this).each(function() {
    var val = $.trim( $(this).text() );

    if ( val ) {
      val = parseFloat( val.replace( /^\$/, "" ) );

      sum += !isNaN( val ) ? val : 0;
    }

  });
  $(this).find('.totalhours').html(sum); 
});

http://jsfiddle.net/qqhD6/

Answer 2

诀窍是将其范围扩大到每个父母。

$('.parent').each(function(){
    var parent = $(this),
        total = parent.find('.totalHours'),
        sum = 0;

    parent.find('.hours').each(function(){
        var hours = $(this),
            text = $.trim(hours.text()),
            value = parseFloat(value);

        sum += !isNaN(value)?value:0;
    });

    total.html(sum);
});

JQuery在每个嵌套部分中收集值的总和

2 个答案: