对多个函数求和
Adding up sum from multiple functions
我有5个表单。每个表单都有一组单选按钮。是=1否=0在这些表单的底部，它输出选择的总和。这一切都很正常。然而，我需要一个输入框，显示下面这5个形式，总计从这些形式和它们的功能的总和。无线电代码的示例如下:
<input type="radio" name="repeat2" value="1" onclick="DisplaySum5(this.value);"> <label>Yes</label>
<input type="radio" name="repeat2" value="0" onclick="DisplaySum5(this.value);"> <label>No</label>
我也张贴的代码，我有功能。现在我需要帮助在组合总输入
中获得这些总价值function DisplaySum(sum) {
var val1 = 0;
for (i = 0; i < document.buildForm.build.length; i++) {
if (document.buildForm.build[i].checked == true) {
val1 = document.buildForm.build[i].value;
}
}
var val2 = 0;
for (i = 0; i < document.buildForm.build2.length; i++) {
if (document.buildForm.build2[i].checked == true) {
val2 = document.buildForm.build2[i].value;
}
}
var val3 = 0;
for (i = 0; i < document.buildForm.build3.length; i++) {
if (document.buildForm.build3[i].checked == true) {
val3 = document.buildForm.build3[i].value;
}
}
var val4 = 0;
for (i = 0; i < document.buildForm.build4.length; i++) {
if (document.buildForm.build4[i].checked == true) {
val4 = document.buildForm.build4[i].value;
}
}
var val5 = 0;
for (i = 0; i < document.buildForm.build5.length; i++) {
if (document.buildForm.build5[i].checked == true) {
val5 = document.buildForm.build5[i].value;
}
}
var sum = parseInt(val1) + parseInt(val2) + parseInt(val3) + parseInt(val4) + parseInt(val5);
document.getElementById('totalSum').value = sum;
}
function DisplaySum2(sum) {
var val1 = 0;
for (i = 0; i < document.attractForm.attract.length; i++) {
if (document.attractForm.attract[i].checked == true) {
val1 = document.attractForm.attract[i].value;
}
}
var val2 = 0;
for (i = 0; i < document.attractForm.attract2.length; i++) {
if (document.attractForm.attract2[i].checked == true) {
val2 = document.attractForm.attract2[i].value;
}
}
var val3 = 0;
for (i = 0; i < document.attractForm.attract3.length; i++) {
if (document.attractForm.attract3[i].checked == true) {
val3 = document.attractForm.attract3[i].value;
}
}
var val4 = 0;
for (i = 0; i < document.attractForm.attract4.length; i++) {
if (document.attractForm.attract4[i].checked == true) {
val4 = document.attractForm.attract4[i].value;
}
}
var val5 = 0;
for (i = 0; i < document.attractForm.attract5.length; i++) {
if (document.attractForm.attract5[i].checked == true) {
val5 = document.attractForm.attract5[i].value;
}
}
var sum = parseInt(val1) + parseInt(val2) + parseInt(val3) + parseInt(val4) + parseInt(val5);
document.getElementById('totalSum2').value = sum;
}
function DisplaySum3(sum) {
var val1 = 0;
for (i = 0; i < document.convertForm.convert.length; i++) {
if (document.convertForm.convert[i].checked == true) {
val1 = document.convertForm.convert[i].value;
}
}
var val2 = 0;
for (i = 0; i < document.convertForm.convert2.length; i++) {
if (document.convertForm.convert2[i].checked == true) {
val2 = document.convertForm.convert2[i].value;
}
}
var val3 = 0;
for (i = 0; i < document.convertForm.convert3.length; i++) {
if (document.convertForm.convert3[i].checked == true) {
val3 = document.convertForm.convert3[i].value;
}
}
var val4 = 0;
for (i = 0; i < document.convertForm.convert4.length; i++) {
if (document.convertForm.convert4[i].checked == true) {
val4 = document.convertForm.convert4[i].value;
}
}
var sum = parseInt(val1) + parseInt(val2) + parseInt(val3) + parseInt(val4);
document.getElementById('totalSum3').value = sum;
}
function DisplaySum4(sum) {
var val1 = 0;
for (i = 0; i < document.closeForm.close.length; i++) {
if (document.closeForm.close[i].checked == true) {
val1 = document.closeForm.close[i].value;
}
}
var val2 = 0;
for (i = 0; i < document.closeForm.close2.length; i++) {
if (document.closeForm.close2[i].checked == true) {
val2 = document.closeForm.close2[i].value;
}
}
var val3 = 0;
for (i = 0; i < document.closeForm.close3.length; i++) {
if (document.closeForm.close3[i].checked == true) {
val3 = document.closeForm.close3[i].value;
}
}
var val4 = 0;
for (i = 0; i < document.closeForm.close4.length; i++) {
if (document.closeForm.close4[i].checked == true) {
val4 = document.closeForm.close4[i].value;
}
}
var sum = parseInt(val1) + parseInt(val2) + parseInt(val3) + parseInt(val4);
document.getElementById('totalSum4').value = sum;
}
function DisplaySum5(sum) {
var val1 = 0;
for (i = 0; i < document.repeatForm.repeat.length; i++) {
if (document.repeatForm.repeat[i].checked == true) {
val1 = document.repeatForm.repeat[i].value;
}
}
var val2 = 0;
for (i = 0; i < document.repeatForm.repeat2.length; i++) {
if (document.repeatForm.repeat2[i].checked == true) {
val2 = document.repeatForm.repeat2[i].value;
}
}
var sum = parseInt(val1) + parseInt(val2);
document.getElementById('totalSum5').value = sum;
}
首先，使用函数而不是复制粘贴相同的代码20次:
function retrieveValue(elements) {
var result = 0;
for( var i = 0; i < elements.length; i++ ) {
if( elements[i].checked === true ) {
result = elements[i].value;
}
}
return result;
}
那么你可以使用这个函数:
function DisplaySum() {
var val1 = retrieveValue( document.buildForm.build );
var val2 = retrieveValue( document.buildForm.build2 );
// etc
}
这会使你的代码更易于管理。
每个DisplaySum函数都应该返回它们的结果。也许他们甚至不应该显示，而只是计算。
function calculateSum1() {
var val1 = retrieveValue( document.buildForm.build );
var val2 = retrieveValue( document.buildForm.build2 );
// ...
var sum = parseInt(val1) + parseInt(val2) + ...;
return sum;
}
function DisplaySum() {
var sum1 = calculateSum1();
var sum2 = calculateSum2();
var sum3 = calculateSum3();
var sum4 = calculateSum4();
var sum5 = calculateSum5();
document.getElementById('totalSum1').value = sum1;
document.getElementById('totalSum2').value = sum2;
document.getElementById('totalSum3').value = sum3;
document.getElementById('totalSum4').value = sum4;
document.getElementById('totalSum5').value = sum5;
var total = sum1 + sum2 + sum3 + sum4 + sum5;
console.log("The total is", total);
}
您只需要这些函数中的每一个都返回一些东西，并将它们全部加起来。
我的建议是拆分计算这些总和的责任，以及正在更改dom值的onclick处理程序。
假设您的显示总和都正常工作，更改它们的结尾以返回一个总和。并使用一个单独的函数来操作dom。
这
function DisplaySum5(sum) {
var val1 = 0;
for (i = 0; i < document.repeatForm.repeat.length; i++) {
if (document.repeatForm.repeat[i].checked == true) {
val1 = document.repeatForm.repeat[i].value;
}
}
var val2 = 0;
for (i = 0; i < document.repeatForm.repeat2.length; i++) {
if (document.repeatForm.repeat2[i].checked == true) {
val2 = document.repeatForm.repeat2[i].value;
}
}
var sum = parseInt(val1) + parseInt(val2);
document.getElementById('totalSum5').value = sum;
}
变成两个函数
function CalcSum5() {
var val1 = 0;
for (i = 0; i < document.repeatForm.repeat.length; i++) {
if (document.repeatForm.repeat[i].checked == true) {
val1 = document.repeatForm.repeat[i].value;
}
}
var val2 = 0;
for (i = 0; i < document.repeatForm.repeat2.length; i++) {
if (document.repeatForm.repeat2[i].checked == true) {
val2 = document.repeatForm.repeat2[i].value;
}
}
var sum = parseInt(val1) + parseInt(val2);
return sum;
}
function HandleSum5(){
var sum = CalcSum5();
document.getElementById('totalSum5').value = sum;
}
，最后你的HTML更改为这个
<input type="radio" name="repeat2" value="1" onclick="HandleSum5(this.value);"> <label>Yes</label>
<input type="radio" name="repeat2" value="0" onclick="HandleSum5(this.value);"> <label>No</label>
那么现在，得到它们的和你可以调用
var totalSum = CalcSum1() + CalcSum2() ...
也有一些我建议的重构，比如重用代码，正确的(小写)函数命名等等，但是不需要解决你当前的问题
相关文章：
- 创建一个类似链接的按钮，并通过Javascript函数打开一个新的弹出窗口
- 将函数的上下文应用于javascript变量
- 如何在JavaScript中将字符串转换为函数引用
- 如何在JavaScript中使用此函数对范围内的所有数字求和
- 使用绑定的简单JavaScript/jQuery求和函数
- Javascript Array 的求和函数问题
- 角度 - 使用函数对数字求和并将其放入视图中
- onChange函数，求和值
- Datatables插件求和函数
- 对多个函数求和
- 试图创建一个对数字求和的Javascript函数
- 对javascript构造函数中的参数求和并返回total
- 函数在不使用parseInt的情况下求和以2为基数的数字的值
- 如何在javascript中求和两个不同的函数
- 如何使用jquery-onlick函数对表单文本字段数组中的值求和
- 当对数组元素求和时，递归函数根据顺序返回不同的值
- 如何在异步函数中对 Javascript 数组的值求和
- 可变curry求和函数
- JavaScript求和函数
- JQuery函数格式和求和或2个文本框的问题
