如何计算 javascript 的平均成绩
How to calculate average grade in javascript
我正在尝试制作一个根据用户输入计算平均成绩的程序。我在 codepen 工作过,但我无法让它工作,因为我希望总和的结果与现实不符。
这是我的 html 和 javascript
<tr id="table-title">
<td>Weging</td>
<td>Cijfer</td>
</tr>
<tr>
<td><input id="weight-1" type="text" size=2 maxlength="5" value=""></td>
<td><input id="mark-1" type="text" size=2 maxlength="5" value=""></td>
</tr>
<tr>
<td><input id="weight-2" type="text" size=2 maxlength="5" value=""></td>
<td><input id="mark-2" type="text" size=2 maxlength="5" value=""></td>
</tr>
<tr>
<td><input id="weight-3" type="text" size=2 maxlength="5" value=""></td>
<td><input id="mark-3" type="text" size=2 maxlength="5" value=""></td>
</tr>
<tr>
<td><input id="weight-4" type="text" size=2 maxlength="5" value=""></td>
<td><input id="mark-4" type="text" size=2 maxlength="5" value=""></td>
</tr>
<tr>
<td><input id="weight-5" type="text" size=2 maxlength="5" value=""></td>
<td><input id="mark-5" type="text" size=2 maxlength="5" value=""></td>
</tr>
<tr>
<td><input id="weight-6" type="text" size=2 maxlength="5" value=""></td>
<td><input id="mark-6" type="text" size=2 maxlength="5" value=""></td>
</tr>
<tr>
<td><input id="weight-7" type="text" size=2 maxlength="5" value=""></td>
<td><input id="mark-7" type="text" size=2 maxlength="5" value=""></td>
</tr>
<tr>
<td><input id="weight-8" type="text" size=2 maxlength="5" value=""></td>
<td><input id="mark-8" type="text" size=2 maxlength="5" value=""></td>
</tr>
<tr>
<td><input id="weight-9" type="text" size=2 maxlength="5" value=""></td>
<td><input id="mark-9" type="text" size=2 maxlength="5" value=""></td>
</tr>
<tr>
<td><input id="weight-10" type="text" size=2 maxlength="5" value=""></td>
<td><input id="mark-10" type="text" size=2 maxlength="5" value=""></td>
</tr>
<tr>
<td><input id="weight-11" type="text" size=2 maxlength="5" value=""></td>
<td><input id="mark-11" type="text" size=2 maxlength="5" value=""></td>
</tr>
<tr>
<td><input id="weight-12" type="text" size=2 maxlength="5" value=""></td>
<td><input id="mark-12" type="text" size=2 maxlength="5" value=""></td>
</tr>
<tr>
<td><input id="weight-13" type="text" size=2 maxlength="5" value=""></td>
<td><input id="mark-13" type="text" size=2 maxlength="5" value=""></td>
</tr>
<tr>
<td><input id="weight-14" type="text" size=2 maxlength="5" value=""></td>
<td><input id="mark-14" type="text" size=2 maxlength="5" value=""></td>
</tr>
<tr>
<td><input id="weight-15" type="text" size=2 maxlength="5" value=""></td>
<td><input id="mark-15" type="text" size=2 maxlength="5" value=""></td>
</tr>
<tr>
<td><input id="weight-16" type="text" size=2 maxlength="5" value=""></td>
<td><input id="mark-16" type="text" size=2 maxlength="5" value=""></td>
</tr>
<tr>
<td><input id="weight-17" type="text" size=2 maxlength="5" value=""></td>
<td><input id="mark-17" type="text" size=2 maxlength="5" value=""></td>
</tr>
<tr>
<td><input id="weight-18" type="text" size=2 maxlength="5" value=""></td>
<td><input id="mark-18" type="text" size=2 maxlength="5" value=""></td>
</tr>
<tr>
<td><input id="weight-19" type="text" size=2 maxlength="5" value=""></td>
<td><input id="mark-19" type="text" size=2 maxlength="5" value=""></td>
</tr>
<tr>
<td><input id="weight-20" type="text" size=2 maxlength="5" value=""></td>
<td><input id="mark-20" type="text" size=2 maxlength="5" value=""></td>
</tr>
</table>
<input id="calc-button" type="button" value="Berekenen je gemiddelde"
onclick="calculator()">
<div id="outputDiv"></div>
</body>
</html>
^在这里我得到用户输入,然后 运行 'calculator' 函数。^
function calculator() {
var weight1=document.getElementById('weight-1').value;
var mark1=document.getElementById('mark-1').value;
var grade1=weight1*mark1;
var weight2=document.getElementById('weight-2').value;
var mark2=document.getElementById('mark-2').value;
var grade2=weight2*mark2;
var weight3=document.getElementById('weight-3').value;
var mark3=document.getElementById('mark-3').value;
var grade3=weight3*mark3;
var weight4=document.getElementById('weight-4').value;
var mark4=document.getElementById('mark-4').value;
var grade4=weight4*mark4;
var weight5=document.getElementById('weight-5').value;
var mark5=document.getElementById('mark-5').value;
var grade5=weight5*mark5;
var weight6=document.getElementById('weight-6').value;
var mark6=document.getElementById('mark-6').value;
var grade6=weight6*mark6;
var weight7=document.getElementById('weight-7').value;
var mark7=document.getElementById('mark-7').value;
var grade7=weight7*mark7;
var weight8=document.getElementById('weight-8').value;
var mark8=document.getElementById('mark-8').value;
var grade8=weight8*mark8;
var weight9=document.getElementById('weight-9').value;
var mark9=document.getElementById('mark-9').value;
var grade9=weight9*mark9;
var weight10=document.getElementById('weight-10').value;
var mark10=document.getElementById('mark-10').value;
var grade10=weight10*mark10;
var weight11=document.getElementById('weight-11').value;
var mark11=document.getElementById('mark-11').value;
var grade11=weight11*mark11;
var weight12=document.getElementById('weight-12').value;
var mark12=document.getElementById('mark-12').value;
var grade12=weight12*mark12;
var weight13=document.getElementById('weight-13').value;
var mark13=document.getElementById('mark-13').value;
var grade13=weight13*mark13;
var weight14=document.getElementById('weight-14').value;
var mark14=document.getElementById('mark-14').value;
var grade14=weight14*mark14;
var weight15=document.getElementById('weight-15').value;
var mark15=document.getElementById('mark-15').value;
var grade15=weight15*mark15;
var weight16=document.getElementById('weight-16').value;
var mark16=document.getElementById('mark-16').value;
var grade16=weight16*mark16;
var weight17=document.getElementById('weight-17').value;
var mark17=document.getElementById('mark-17').value;
var grade17=weight17*mark17;
var weight18=document.getElementById('weight-18').value;
var mark18=document.getElementById('mark-18').value;
var grade18=weight18*mark18;
var weight19=document.getElementById('weight-19').value;
var mark19=document.getElementById('mark-19').value;
var grade19=weight19*mark19;
var weight20=document.getElementById('weight-20').value;
var mark20=document.getElementById('mark-20').value;
var grade20=weight20*mark20;
var
totalweight=weight1+weight2+weight3+weight4+
weight5+weight6+weight7+weight8+weight9+weight10+
weight11+weight12+weight13+weight14+weight15+weight16+
weight17+weight18+weight19+weight20;
var
totalgrade=grade1+grade2+grade3+grade4+
grade5+grade6+grade7+grade8+grade9+grade10+
grade11+grade12+grade13+grade14+grade15+grade16+
grade17+grade18+grade19+grade20;
var finalgrade=totalgrade/totalweight;
var display=document.getElementById('outputDiv');
display.innerHTML='Je gemiddelde is: ' +finalgrade.toFixed(3);
}
^这里我尝试在 'total' 变量中添加用户输入
现在这里出了问题,我不知道在哪里。我一直在寻找一个
解决了几天。
PS。
这是笔的link:https://codepen.io/53N71N3L/pen/JBGYgO
您的权重被视为字符串并被连接起来,而不是通过 +
操作添加。
如前所述,您的权重被视为字符串。
我在这里重写你的代码:
function getValue(el){
return (+document.getElementById(el).value)
};
function calculator() {
var weight1=getValue('weight-1');
var mark1=getValue('mark-1');
var grade1=weight1*mark1;
var weight2=getValue('weight-2');
var mark2=getValue('mark-2');
var grade2=weight2*mark2;
var weight3=getValue('weight-3');
var mark3=getValue('mark-3');
var grade3=weight3*mark3;
var weight4=getValue('weight-4');
var mark4=getValue('mark-4');
var grade4=weight4*mark4;
var weight5=getValue('weight-5');
var mark5=getValue('mark-5');
var grade5=weight5*mark5;
var weight6=getValue('weight-6');
var mark6=getValue('mark-6');
var grade6=weight6*mark6;
var weight7=getValue('weight-7');
var mark7=getValue('mark-7');
var grade7=weight7*mark7;
var weight8=getValue('weight-8');
var mark8=getValue('mark-8');
var grade8=weight8*mark8;
var weight9=getValue('weight-9');
var mark9=getValue('mark-9');
var grade9=weight9*mark9;
var weight10=getValue('weight-10');
var mark10=getValue('mark-10');
var grade10=weight10*mark10;
var weight11=getValue('weight-11');
var mark11=getValue('mark-11');
var grade11=weight11*mark11;
var weight12=getValue('weight-12');
var mark12=getValue('mark-12');
var grade12=weight12*mark12;
var weight13=getValue('weight-13');
var mark13=getValue('mark-13');
var grade13=weight13*mark13;
var weight14=getValue('weight-14');
var mark14=getValue('mark-14');
var grade14=weight14*mark14;
var weight15=getValue('weight-15');
var mark15=getValue('mark-15');
var grade15=weight15*mark15;
var weight16=getValue('weight-16');
var mark16=getValue('mark-16');
var grade16=weight16*mark16;
var weight17=getValue('weight-17');
var mark17=getValue('mark-17');
var grade17=weight17*mark17;
var weight18=getValue('weight-18');
var mark18=getValue('mark-18');
var grade18=weight18*mark18;
var weight19=getValue('weight-19');
var mark19=getValue('mark-19');
var grade19=weight19*mark19;
var weight20=getValue('weight-20');
var mark20=getValue('mark-20');
var grade20=weight20*mark20;
var totalweight=weight1+weight2+weight3+weight4+weight5+weight6+weight7+weight8+weight9+weight10+weight11+weight12+weight13+weight14+weight15+weight16+weight17+weight18+weight19+weight20;
var totalgrade=grade1+grade2+grade3+grade4+grade5+grade6+grade7+grade8+grade9+grade10+grade11+grade12+grade13+grade14+grade15+grade16+grade17+grade18+grade19+grade20;
var finalgrade=totalgrade/totalweight;
var display=document.getElementById('outputDiv');
display.innerHTML='Je gemiddelde is: ' +finalgrade.toFixed(3);
}
getValue
函数将确保您有一个 return 值作为数字(+
这里会将其解析为数字)。
我正在尝试制作一个根据用户输入计算平均成绩的程序。我在 codepen 工作过,但我无法让它工作,因为我希望总和的结果与现实不符。
这是我的 html 和 javascript
<tr id="table-title">
<td>Weging</td>
<td>Cijfer</td>
</tr>
<tr>
<td><input id="weight-1" type="text" size=2 maxlength="5" value=""></td>
<td><input id="mark-1" type="text" size=2 maxlength="5" value=""></td>
</tr>
<tr>
<td><input id="weight-2" type="text" size=2 maxlength="5" value=""></td>
<td><input id="mark-2" type="text" size=2 maxlength="5" value=""></td>
</tr>
<tr>
<td><input id="weight-3" type="text" size=2 maxlength="5" value=""></td>
<td><input id="mark-3" type="text" size=2 maxlength="5" value=""></td>
</tr>
<tr>
<td><input id="weight-4" type="text" size=2 maxlength="5" value=""></td>
<td><input id="mark-4" type="text" size=2 maxlength="5" value=""></td>
</tr>
<tr>
<td><input id="weight-5" type="text" size=2 maxlength="5" value=""></td>
<td><input id="mark-5" type="text" size=2 maxlength="5" value=""></td>
</tr>
<tr>
<td><input id="weight-6" type="text" size=2 maxlength="5" value=""></td>
<td><input id="mark-6" type="text" size=2 maxlength="5" value=""></td>
</tr>
<tr>
<td><input id="weight-7" type="text" size=2 maxlength="5" value=""></td>
<td><input id="mark-7" type="text" size=2 maxlength="5" value=""></td>
</tr>
<tr>
<td><input id="weight-8" type="text" size=2 maxlength="5" value=""></td>
<td><input id="mark-8" type="text" size=2 maxlength="5" value=""></td>
</tr>
<tr>
<td><input id="weight-9" type="text" size=2 maxlength="5" value=""></td>
<td><input id="mark-9" type="text" size=2 maxlength="5" value=""></td>
</tr>
<tr>
<td><input id="weight-10" type="text" size=2 maxlength="5" value=""></td>
<td><input id="mark-10" type="text" size=2 maxlength="5" value=""></td>
</tr>
<tr>
<td><input id="weight-11" type="text" size=2 maxlength="5" value=""></td>
<td><input id="mark-11" type="text" size=2 maxlength="5" value=""></td>
</tr>
<tr>
<td><input id="weight-12" type="text" size=2 maxlength="5" value=""></td>
<td><input id="mark-12" type="text" size=2 maxlength="5" value=""></td>
</tr>
<tr>
<td><input id="weight-13" type="text" size=2 maxlength="5" value=""></td>
<td><input id="mark-13" type="text" size=2 maxlength="5" value=""></td>
</tr>
<tr>
<td><input id="weight-14" type="text" size=2 maxlength="5" value=""></td>
<td><input id="mark-14" type="text" size=2 maxlength="5" value=""></td>
</tr>
<tr>
<td><input id="weight-15" type="text" size=2 maxlength="5" value=""></td>
<td><input id="mark-15" type="text" size=2 maxlength="5" value=""></td>
</tr>
<tr>
<td><input id="weight-16" type="text" size=2 maxlength="5" value=""></td>
<td><input id="mark-16" type="text" size=2 maxlength="5" value=""></td>
</tr>
<tr>
<td><input id="weight-17" type="text" size=2 maxlength="5" value=""></td>
<td><input id="mark-17" type="text" size=2 maxlength="5" value=""></td>
</tr>
<tr>
<td><input id="weight-18" type="text" size=2 maxlength="5" value=""></td>
<td><input id="mark-18" type="text" size=2 maxlength="5" value=""></td>
</tr>
<tr>
<td><input id="weight-19" type="text" size=2 maxlength="5" value=""></td>
<td><input id="mark-19" type="text" size=2 maxlength="5" value=""></td>
</tr>
<tr>
<td><input id="weight-20" type="text" size=2 maxlength="5" value=""></td>
<td><input id="mark-20" type="text" size=2 maxlength="5" value=""></td>
</tr>
</table>
<input id="calc-button" type="button" value="Berekenen je gemiddelde"
onclick="calculator()">
<div id="outputDiv"></div>
</body>
</html>
^在这里我得到用户输入,然后 运行 'calculator' 函数。^
function calculator() {
var weight1=document.getElementById('weight-1').value;
var mark1=document.getElementById('mark-1').value;
var grade1=weight1*mark1;
var weight2=document.getElementById('weight-2').value;
var mark2=document.getElementById('mark-2').value;
var grade2=weight2*mark2;
var weight3=document.getElementById('weight-3').value;
var mark3=document.getElementById('mark-3').value;
var grade3=weight3*mark3;
var weight4=document.getElementById('weight-4').value;
var mark4=document.getElementById('mark-4').value;
var grade4=weight4*mark4;
var weight5=document.getElementById('weight-5').value;
var mark5=document.getElementById('mark-5').value;
var grade5=weight5*mark5;
var weight6=document.getElementById('weight-6').value;
var mark6=document.getElementById('mark-6').value;
var grade6=weight6*mark6;
var weight7=document.getElementById('weight-7').value;
var mark7=document.getElementById('mark-7').value;
var grade7=weight7*mark7;
var weight8=document.getElementById('weight-8').value;
var mark8=document.getElementById('mark-8').value;
var grade8=weight8*mark8;
var weight9=document.getElementById('weight-9').value;
var mark9=document.getElementById('mark-9').value;
var grade9=weight9*mark9;
var weight10=document.getElementById('weight-10').value;
var mark10=document.getElementById('mark-10').value;
var grade10=weight10*mark10;
var weight11=document.getElementById('weight-11').value;
var mark11=document.getElementById('mark-11').value;
var grade11=weight11*mark11;
var weight12=document.getElementById('weight-12').value;
var mark12=document.getElementById('mark-12').value;
var grade12=weight12*mark12;
var weight13=document.getElementById('weight-13').value;
var mark13=document.getElementById('mark-13').value;
var grade13=weight13*mark13;
var weight14=document.getElementById('weight-14').value;
var mark14=document.getElementById('mark-14').value;
var grade14=weight14*mark14;
var weight15=document.getElementById('weight-15').value;
var mark15=document.getElementById('mark-15').value;
var grade15=weight15*mark15;
var weight16=document.getElementById('weight-16').value;
var mark16=document.getElementById('mark-16').value;
var grade16=weight16*mark16;
var weight17=document.getElementById('weight-17').value;
var mark17=document.getElementById('mark-17').value;
var grade17=weight17*mark17;
var weight18=document.getElementById('weight-18').value;
var mark18=document.getElementById('mark-18').value;
var grade18=weight18*mark18;
var weight19=document.getElementById('weight-19').value;
var mark19=document.getElementById('mark-19').value;
var grade19=weight19*mark19;
var weight20=document.getElementById('weight-20').value;
var mark20=document.getElementById('mark-20').value;
var grade20=weight20*mark20;
var
totalweight=weight1+weight2+weight3+weight4+
weight5+weight6+weight7+weight8+weight9+weight10+
weight11+weight12+weight13+weight14+weight15+weight16+
weight17+weight18+weight19+weight20;
var
totalgrade=grade1+grade2+grade3+grade4+
grade5+grade6+grade7+grade8+grade9+grade10+
grade11+grade12+grade13+grade14+grade15+grade16+
grade17+grade18+grade19+grade20;
var finalgrade=totalgrade/totalweight;
var display=document.getElementById('outputDiv');
display.innerHTML='Je gemiddelde is: ' +finalgrade.toFixed(3);
}
^这里我尝试在 'total' 变量中添加用户输入 现在这里出了问题,我不知道在哪里。我一直在寻找一个 解决了几天。
PS。 这是笔的link:https://codepen.io/53N71N3L/pen/JBGYgO
您的权重被视为字符串并被连接起来,而不是通过 +
操作添加。
如前所述,您的权重被视为字符串。 我在这里重写你的代码:
function getValue(el){
return (+document.getElementById(el).value)
};
function calculator() {
var weight1=getValue('weight-1');
var mark1=getValue('mark-1');
var grade1=weight1*mark1;
var weight2=getValue('weight-2');
var mark2=getValue('mark-2');
var grade2=weight2*mark2;
var weight3=getValue('weight-3');
var mark3=getValue('mark-3');
var grade3=weight3*mark3;
var weight4=getValue('weight-4');
var mark4=getValue('mark-4');
var grade4=weight4*mark4;
var weight5=getValue('weight-5');
var mark5=getValue('mark-5');
var grade5=weight5*mark5;
var weight6=getValue('weight-6');
var mark6=getValue('mark-6');
var grade6=weight6*mark6;
var weight7=getValue('weight-7');
var mark7=getValue('mark-7');
var grade7=weight7*mark7;
var weight8=getValue('weight-8');
var mark8=getValue('mark-8');
var grade8=weight8*mark8;
var weight9=getValue('weight-9');
var mark9=getValue('mark-9');
var grade9=weight9*mark9;
var weight10=getValue('weight-10');
var mark10=getValue('mark-10');
var grade10=weight10*mark10;
var weight11=getValue('weight-11');
var mark11=getValue('mark-11');
var grade11=weight11*mark11;
var weight12=getValue('weight-12');
var mark12=getValue('mark-12');
var grade12=weight12*mark12;
var weight13=getValue('weight-13');
var mark13=getValue('mark-13');
var grade13=weight13*mark13;
var weight14=getValue('weight-14');
var mark14=getValue('mark-14');
var grade14=weight14*mark14;
var weight15=getValue('weight-15');
var mark15=getValue('mark-15');
var grade15=weight15*mark15;
var weight16=getValue('weight-16');
var mark16=getValue('mark-16');
var grade16=weight16*mark16;
var weight17=getValue('weight-17');
var mark17=getValue('mark-17');
var grade17=weight17*mark17;
var weight18=getValue('weight-18');
var mark18=getValue('mark-18');
var grade18=weight18*mark18;
var weight19=getValue('weight-19');
var mark19=getValue('mark-19');
var grade19=weight19*mark19;
var weight20=getValue('weight-20');
var mark20=getValue('mark-20');
var grade20=weight20*mark20;
var totalweight=weight1+weight2+weight3+weight4+weight5+weight6+weight7+weight8+weight9+weight10+weight11+weight12+weight13+weight14+weight15+weight16+weight17+weight18+weight19+weight20;
var totalgrade=grade1+grade2+grade3+grade4+grade5+grade6+grade7+grade8+grade9+grade10+grade11+grade12+grade13+grade14+grade15+grade16+grade17+grade18+grade19+grade20;
var finalgrade=totalgrade/totalweight;
var display=document.getElementById('outputDiv');
display.innerHTML='Je gemiddelde is: ' +finalgrade.toFixed(3);
}
getValue
函数将确保您有一个 return 值作为数字(+
这里会将其解析为数字)。