Jquery 获取表中的总时间和

我在Symfony2中有一个方法，用于渲染两个时间字段的总小时数

现在我想在数据库更新时在模板中自动计算

  <table>
     <tr>
       <th>Total Hours</th>
       <th>Name</th>
     </tr>

     <tr>
         <td>Pedro<td>
        <td class="hours">2:00</td>//total hours from getHoursWorked() method
     </tr>

     <tr>
         <td>alan<td>
        <td class="hours">1:43</td>//total hours from getHoursWorked() method
     </tr>

     <p> Total hours is<button id="addTimes"></button>: </p>

     <span id="timesum"></span>

剧本

<script>
    Number.prototype.padDigit = function () {
        return (this < 10) ? '0' + this : this;
    }

    $("#addTimes").on('click', function () {
        var t1 = "00:00";
        var mins = 0;
        var hrs = 0;
        $('.hours').each(function () {
            t1 = t1.split(':');
            var t2 = $(this).val().split(':');
            mins = Number(t1[1]) + Number(t2[1]);
            minhrs = Math.floor(parseInt(mins / 60));
            hrs = Number(t1[0]) + Number(t2[0]) + minhrs;
            mins = mins % 60;
            t1 = hrs.padDigit() + ':' + mins.padDigit()
        });
        $('#timeSum').text(t1);
    });
</script>

您将如何操作？

您使用

.val（）

从

td

获取值。您需要使用

.text（）

，因为

val（）

是从表单元素获取值

Number.prototype.padDigit=function（）{
返回值（this<10）“'0'+this:this；
}
$（“#addTimes”）。在（'click'，function（）上{
var t1=“00:00”；
var-mins=0；
var-hrs=0；
$（'.hours'）。每个（函数（）{
t1=t1.分裂（'：'）；
var t2=$（this.text（）.split（'：'）；
分钟=数字（t1[1]）+数字（t2[1]）；
minhrs=数学楼层（parseInt（分钟/60））；
小时数=数量（t1[0]）+数量（t2[0]）+分钟小时数；
分钟=分钟%60；
t1=hrs.padDigit（）+'：'+mins.padDigit（）
控制台日志（t1）；
});
$（'timesum'）。文本（t1）；
});

总小时数
名称
佩德罗
2:00
艾伦
1:43
总时数为：

加：

您正在使用
.val（）
从
td
获取值。您需要使用
.text（）
，因为
val（）
是从表单元素获取值


Number.prototype.padDigit=function（）{
返回值（this<10）“'0'+this:this；
}
$（“#addTimes”）。在（'click'，function（）上{
var t1=“00:00”；
var-mins=0；
var-hrs=0；
$（'.hours'）。每个（函数（）{
t1=t1.分裂（'：'）；
var t2=$（this.text（）.split（'：'）；
分钟=数字（t1[1]）+数字（t2[1]）；
minhrs=数学楼层（parseInt（分钟/60））；
小时数=数量（t1[0]）+数量（t2[0]）+分钟小时数；
分钟=分钟%60；
t1=hrs.padDigit（）+'：'+mins.padDigit（）
控制台日志（t1）；
});
$（'timesum'）。文本（t1）；
});

总小时数
名称
佩德罗
2:00
艾伦
1:43
总时数为：

加：

尝试使用下面的脚本

<script>
    Number.prototype.padDigit = function () {
        return (this < 10) ? '0' + this : this;
    }
    $("#addTimes").on('click', function () {
        var t1 = "00:00";
        var mins = 0;
        var hrs = 0;
        $('.hours').each(function () {
            t1 = t1.split(':');
            var t2 = $(this).text().split(':');
            mins = Number(t1[1]) + Number(t2[1]);
            minhrs = Math.floor(parseInt(mins / 60));
            hrs = Number(t1[0]) + Number(t2[0]) + minhrs;
            mins = mins % 60;
            t1 = hrs.padDigit() + ':' + mins.padDigit()
        });
        $('#timeSum').text(t1);
    });
</script>


Number.prototype.padDigit=函数（）{
返回值（this<10）“'0'+this:this；
}
$（“#addTimes”）。在（'click'，函数（）{
var t1=“00:00”；
var-mins=0；
var-hrs=0；
$（'.hours'）。每个（函数（）{
t1=t1.分裂（'：'）；
var t2=$（this.text（）.split（'：'）；
分钟=数字（t1[1]）+数字（t2[1]）；
minhrs=数学楼层（parseInt（分钟/60））；
小时数=数量（t1[0]）+数量（t2[0]）+分钟小时数；
分钟=分钟%60；
t1=hrs.padDigit（）+'：'+mins.padDigit（）
});
$（'timeSum'）。文本（t1）；
});
尝试使用下面的脚本

<script>
    Number.prototype.padDigit = function () {
        return (this < 10) ? '0' + this : this;
    }
    $("#addTimes").on('click', function () {
        var t1 = "00:00";
        var mins = 0;
        var hrs = 0;
        $('.hours').each(function () {
            t1 = t1.split(':');
            var t2 = $(this).text().split(':');
            mins = Number(t1[1]) + Number(t2[1]);
            minhrs = Math.floor(parseInt(mins / 60));
            hrs = Number(t1[0]) + Number(t2[0]) + minhrs;
            mins = mins % 60;
            t1 = hrs.padDigit() + ':' + mins.padDigit()
        });
        $('#timeSum').text(t1);
    });
</script>


Number.prototype.padDigit=函数（）{
返回值（this<10）“'0'+this:this；
}
$（“#addTimes”）。在（'click'，函数（）{
var t1=“00:00”；
var-mins=0；
var-hrs=0；
$（'.hours'）。每个（函数（）{
t1=t1.分裂（'：'）；
var t2=$（this.text（）.split（'：'）；
分钟=数字（t1[1]）+数字（t2[1]）；
minhrs=数学楼层（parseInt（分钟/60））；
小时数=数量（t1[0]）+数量（t2[0]）+分钟小时数；
分钟=分钟%60；
t1=hrs.padDigit（）+'：'+mins.padDigit（）
});
$（'timeSum'）。文本（t1）；
});
您能添加一个更好的html示例吗？关于输入字段
.price
和所有内容的详细信息。@RejithRKrishnan我已经更新了HTMLC，您能添加一个更好的html示例吗？关于输入字段
.price
和所有内容的详细信息。@RejithRKrishnan我已经更新了html
<script>
    Number.prototype.padDigit = function () {
        return (this < 10) ? '0' + this : this;
    }
    $("#addTimes").on('click', function () {
        var t1 = "00:00";
        var mins = 0;
        var hrs = 0;
        $('.hours').each(function () {
            t1 = t1.split(':');
            var t2 = $(this).text().split(':');
            mins = Number(t1[1]) + Number(t2[1]);
            minhrs = Math.floor(parseInt(mins / 60));
            hrs = Number(t1[0]) + Number(t2[0]) + minhrs;
            mins = mins % 60;
            t1 = hrs.padDigit() + ':' + mins.padDigit()
        });
        $('#timeSum').text(t1);
    });
</script>