JavaScript表单数据汇总求值问题

JavaScript表单数据汇总求值问题

问题描述:

请问如何在每个框框的鼠标焦点消失后(onblur)汇总每个框框的数据并进行加总求平均值?我刚学不久这个问题困扰我很久了,因为JavaScript的同异步问题,我在onblur function内获得的变量拿不到function外用(显示undefined)我在function外定义的变量也因为异步问题无法经过function内的步骤改变,我定义好的方法拿进function中计算value后结果不能拿出来去其他方法,我的思路是把所有输入值先进行汇总后求平均值请问我该怎么做?能麻烦指明一下到底是哪块的问题我没有掌握好?(不能用jquery)

img

每个onblur都要获取所有input进行值的计算,有值就加对应的值,否则就加0,然后进行计算后显示内容。onblur累加这个input的值有bug,多次聚集时区焦点就累加多次了。
应该是获取所有计算的input,对这些input重新计算值。

示例代码如下,自己改下逻辑

img

<input type="text" value="0" class="input" /> / year<br />
<input type="text" value="0" class="input" /> / year<br />
<input type="text" value="0" class="input" /> / year<br />
<input type="text" value="0" class="input" /> / year<br />
<div id="dv"></div>
<script>
    function calculate(){
        var sum = 0;
        for (var el of inputs) sum += parseFloat(el.value) || 0;
        dv.innerHTML = `总和:${sum} 平均值:${sum / inputs.length}`
    }
    var inputs = document.querySelectorAll('input.input');//获取要计算的text
    for (var el of inputs) el.onblur = calculate;

</script>

有帮助麻烦点下【采纳该答案】

你把你代码贴出来