Javascript JQuery动态循环问题

我有一个表，其中有多个表供多个用户使用。这些用户可以增加或减少加班时间，所以我尝试使其尽可能动态。我会附上两个样品表，这样你就知道了

<div class="timecard">
 <h3>tommytest</h3>

<table class="misc_items timecard_list" border="0" cellpadding="2" cellspacing="0" style="margin:0 auto;">
    <tbody>
        <tr class="display_row odd">
            <td align="left" class="job_code" style="color:#000099">2400-Orchard</td>
            <td align="right">9:47am</td>
            <td align="right">5/19/2014</td>
            <td align="right" class="hrs">01:00</td>
        </tr>
        <tr class="display_odd row">
            <td align="left" class="job_code" style="color:#000099">1200-Duffy's</td>
            <td align="right">12:37am</td>
            <td align="right">5/17/2014</td>
            <td align="right" class="hrs">2:00</td>
        </tr>
    </tbody>
</table>
</div>
<div class="timecard">
 <h3>testtest</h3>

<table class="misc_items timecard_list" border="0" cellpadding="2" cellspacing="0" style="margin:0 auto;">
    <tbody>
        <tr class="display_row odd">
            <td align="left" class="job_code" style="color:#000099">2400-Orchard</td>
            <td align="right">9:47am</td>
            <td align="right">5/19/2014</td>
            <td align="right" class="hrs">01:00</td>
        </tr>
        <tr class="display_odd row">
            <td align="left" class="job_code" style="color:#000099">1200-Duffy's</td>
            <td align="right">12:37am</td>
            <td align="right">5/17/2014</td>
            <td align="right" class="hrs">2:00</td>
        </tr>
    </tbody>
</table>
</div>
<div id="total"></div>

托米测试
2400果园
上午9:47
5/19/2014
01:00
1200达菲
上午12:37
5/17/2014
2:00
测试
2400果园
上午9:47
5/19/2014
01:00
1200达菲
上午12:37
5/17/2014
2:00

然后，我有了这个JQuery脚本，它从不同职务代码的员工时间中获取总数，并将其相加。脚本本身对于每个作业代码都是动态的，但我正在尝试使其成为动态的，以便它在第一个表或用户中运行，输出总计，然后对下一个表执行相同的操作，依此类推

$(document).ready(function () {

var timeString = $(this).next('td.hrs').text();
var components = timeString.split(':');
var seconds = components[1] ? parseInt(components[1], 10) : 0;
var hrs = parseInt(components[0], 10) + seconds / 60;
total += hrs;

var temp = [];
$('.job_code').each(function (index, element) {
    var text = $(this).text();
    if (text != 'Out') {
        temp.push(text);
    }
});

// remove duplicates
var job_code = [];
$.each(temp, function (index, element) {
    if ($.inArray(element, job_code) === -1) job_code.push(element);
});

var sum = {};
$.each(job_code, function (index, element) {
    var total = 0;
    $('.job_code:contains(' + element + ')').each(function (key, value) {
        var timeString = $(this).siblings('td.hrs').text();
        var components = timeString.split(':');
        var seconds = components[1] ? parseInt(components[1], 10) : 0;
        var hrs = parseInt(components[0], 10) + seconds / 60;
        total += hrs;
        sum[index] = {
            'job_code': element,
                'total': total
        };
    });
});

console.log(sum);

$.each(sum, function (index, element) {
    $('#total').append('<p>Total for ' + element.job_code + ': ' + element.total + '</p>');
});

});

$（文档）.ready（函数（）{
var timeString=$（this.next（'td.hrs'）.text（）；
var components=timeString.split（“：”）；
var seconds=components[1]？parseInt（components[1]，10）：0；
var-hrs=parseInt（组件[0]，10）+秒/60；
总+=小时；
var-temp=[]；
$（'.job_code'）。每个（函数（索引，元素）{
var text=$（this.text（）；
如果（文本！=“输出”）{
临时推送（文本）；
}
});
//删除重复项
var作业代码=[]；
$。每个（临时、功能（索引、元素）{
if（$.inArray（元素，作业代码）=-1）作业代码.push（元素）；
});
var和={}；
$.each（作业代码、函数（索引、元素）{
var合计=0；
$（'.job_代码：包含（'+element+'））。每个（函数（键、值）{
var timeString=$（this.this（'td.hrs'）.text（）；
var components=timeString.split（“：”）；
var seconds=components[1]？parseInt（components[1]，10）：0；
var-hrs=parseInt（组件[0]，10）+秒/60；
总+=小时；
总和[指数]={
“作业代码”：元素，
“总计”：总计
};
});
});
控制台日志（总和）；
$。每个（总和、函数（索引、元素）{
$（“#total”）.append（“+element.job_code+”的“total:“+element.total+”
”）；
});
});

任何建议都将不胜感激，因为我刚刚开始使用javascript，并且很快就要完成我的功能。这里是一个示例的链接

---

提前感谢

这就是您想要的：

  function tfoot(total){
  var tfoot = ['<tfoot>',
         '<tr>',
         '<td colspan="3">Total</td>',
         '<td>'+total+'</td>',
         '</tr>',
         '</tfoot>'];
 return tfoot.join('/n');
 }

$('table').each(function(){
 var sum = 0;
 $(this).find('td.hrs').each(function(){
  sum+= +$(this).text().split(':')[0]
 });
 $(this).append(tfoot(sum));
});

函数tfoot（总计）{
var tfoot=[''，
'',
“总计”，
''+总计+''，
'',
''];
返回tfoot.join（'/n'）；
}
$（'table'）。每个（函数（）{
var总和=0；
$（this.find（'td.hrs'）。每个（函数（）{
sum+=+$（this.text（）.split（'：'）[0]
});
$（this.append（tfoot（sum））；
});

编辑：

 function toSeconds(s){
  var p = s.split(':');
  return parseInt(p[0], 10) * 3600 + parseInt(p[1], 10) * 60;
 }

function fill(s, digits) {
 s = s.toString();
 while (s.length < digits) s = '0' + s;
  return s;
 }

function addRows(obj){
 var rows='<tr><td colspan="4">Total:</td></tr>';
 for(var key in obj){
 var formatted = fill(Math.floor(obj[key] / 3600), 2) + ':' +
 fill(Math.floor(obj[key] / 60) % 60, 2); 
  rows+='<tr><td colspan="3">'+key+'</td><td>'+formatted+'</td></tr>';
 } 
return rows;
}

$('table').each(function(){
 var tr = {};
 $(this).find('tr').each(function(){
 var key = $(this).find('td.job_code').text();
 var val1 = toSeconds($(this).find('td.hrs').text());
//var val = +$(this).find('td.hrs').text().split(':')[0];
if(tr[key]){
  tr[key]+=val1;
 }else{
   tr[key]=val1; 
 } 
});

$(this).append(function(){
 var tfoot = $('<tfoot/>', {
 html: addRows(tr)
});
 return tfoot;
});
});

函数到秒{
var p=s.split（“：”）；
返回parseInt（p[0]，10）*3600+parseInt（p[1]，10）*60；
}
函数填充（个，位数）{
s=s.toString（）；
而（s.长度<位数）s='0'+s；
返回s；
}
函数addRows（obj）{
var rows='Total:'；
for（obj中的var键）{
var formatted=fill（数学地板（obj[key]/3600），2）+'：'+
填充（数学层（obj[键]/60）%60,2）；
行+=''+键+''+格式化+''；
} 
返回行；
}
$（'table'）。每个（函数（）{
var tr={}；
$（this）.find（'tr'）.each（function（）{
var key=$（this.find（'td.job_code'）.text（）；
var val1=toSeconds（$（this.find（'td.hrs'）.text（））；
//var val=+$（this.find（'td.hrs'）.text（）.split（'：'）[0]；
如果（tr[键]）{
tr[key]+=val1；
}否则{
tr[key]=val1；
} 
});
$（this.append（function（））{
var tfoot=$（''{
html:addRows（tr）
});
返回tfoot；
});
});

---

您是否尝试将动态表添加到其中并运行？@SSS我尝试了一点，但我只是发布了我正在使用的动态代码，因为我希望在走错之前得到一些指导。只需在回调函数中编写计算代码，就可以了。当动态添加的内容Y您的设计似乎不允许每个用户/表的总计时调用该函数。您想如何处理单个用户总数？@SSS您能给我看一个示例JSFIDLE吗？@mgardner05不确定这是否是您想要的？非常接近。而不是将所有作业代码合计在一起。我希望每个人都能单独合计。比如说工作代码1有3个小时，工作代码2有5个小时。你的代码可以改变吗？啊，你想动态地创建表，并按作业代码对其进行分组吗。如果你看看我的示例JSFIDLE，你会得到一个更好的想法。我希望它在每个表中运行，并像我现有的代码对每个表所做的那样，不管有多少个表。我希望在每个单独的总计下得到总计，而不是在所有表中相加。这有用吗？