JavaScript keyup 和 onload 计算字段总数

Question

我正在使用 JavaScript 计算两个文本输入。它适用于 keyup。即打字时，余额实时计算。但是，我希望总数不仅在 keyup 上计算和显示，而且在 onload 上也计算和显示，所以当我加载页面时，它已经计算了字段。

这是我目前仅用于 keyup 的有效 javascript 代码

<script type="text/javascript">
$(document).on("keyup", function() {
var sum = 0;
$(".totalCal").each(function(){
    sum += +$(this).val();
});
$("#total").val(sum);

document.getElementById('grandTotal').innerHTML = sum.toFixed(2);
});
</script>

Answer 1

https://jsfiddle.net/L2s5yoth/

HTML:

<input type="text" value="0" class="totalCal"><br />
<input type="text" value="1" class="totalCal"><br />
<input type="text" value="2" class="totalCal"><br />
<input type="text" value="3" class="totalCal"><br />
<div id="total">0</div>

jQuery:

$(document).ready(calculate);   
$(document).on("keyup", calculate);

function calculate() {
    var sum = 0;
    $(".totalCal").each(function(){
        sum += +$(this).val();
    });
    $("#total").html(sum);
}