在javascript函数中插入变量

我想要一些关于如何“功能化”我的Javascript代码的指导，以便减少行数。现在，正如您可能从代码中看到的，我只是复制、粘贴和更改关键字（在脚本中用作名称、ID和变量）

在本节中，我想将最后的“3”改为1到5之间的任何数字，因为我们需要收集每家公司多达5名董事的财务数据

如何在第一行“function calcNet3（）{”中设置传递（），从而相应地调整var和document.getElementById（“…”）中的最终“3”？我希望只创建一个“function calcNet（）”，它将能够根据需要对1、2、3、4或5进行排序

这是我现在的函数。它可以工作……我只是想让它更灵活。我知道我需要调整HTML onchange，以便将“3”参数放入函数括号中

function calcNet3() {
    // at a .value so that we are getting the value out of the form boxes
var res1a3 = document.getElementById("residence1value3").value;
var res1b3 = document.getElementById("residence1debt3").value;
var res2a3 = document.getElementById("residence2value3").value;
var res2b3 = document.getElementById("residence2debt3").value;
var res3a3 = document.getElementById("residence3value3").value;
var res3b3 = document.getElementById("residence3debt3").value;
var inv1a3 = document.getElementById("invprop1value3").value;
var inv1b3 = document.getElementById("invprop1debt3").value;
var inv2a3 = document.getElementById("invprop2value3").value;
var inv2b3 = document.getElementById("invprop2debt3").value;
var inv3a3 = document.getElementById("invprop3value3").value;
var inv3b3 = document.getElementById("invprop3debt3").value;
var port13 = document.getElementById("shareport1value3").value;
var port23 = document.getElementById("shareport2value3").value;
var port33 = document.getElementById("shareport3value3").value;
var bank13 = document.getElementById("cash1value3").value;
var bank23 = document.getElementById("cash2value3").value;
var bank33 = document.getElementById("cash3value3").value;

// calculate net worth into a variable, put "+" in front of variable to make sure it is     a number
var nw3 = +res1a3 - +res1b3 + +res2a3 - +res2b3 + +res3a3 - +res3b3 + +inv1a3 - +inv1b3 + +inv2a3 - +inv2b3 + +inv3a3 - +inv3b3 + +port13 + +port23 + +port33 + +bank13 + +bank23 + +bank33;

// take the answer and feed it into the postFV function so that it gets added to the right span
postWorth3(nw3);

}

如果这个问题已经被问到和回答，请把我送到正确的地方。我进行了搜索，但不幸的是没有找到合适的答案。

您可以将calcNet（）更改为使用eval（），以便它可以根据提供的参数创建变量。它还将根据提供的参数使用正确版本的postWorth（）

function calcNet(x) {
    eval("var res1a" + x + " = document.getElementById('residence1value" + x + "').value;");
    eval("var res1b" + x + " = document.getElementById('residence1debt" + x + "').value;");
    eval("var res2a" + x + " = document.getElementById('residence2value" + x + "').value;");
    eval("var res2b" + x + " = document.getElementById('residence2debt" + x + "').value;");
    eval("var res3a" + x + " = document.getElementById('residence3value" + x + "').value;");
    eval("var res3b" + x + " = document.getElementById('residence3debt" + x + "').value;");
    eval("var inv1a" + x + " = document.getElementById('invprop1value" + x + "').value;");
    eval("var inv1b" + x + " = document.getElementById('invprop1debt" + x + "').value;");
    eval("var inv2a" + x + " = document.getElementById('invprop2value" + x + "').value;");
    eval("var inv2b" + x + " = document.getElementById('invprop2debt" + x + "').value;");
    eval("var inv3a" + x + " = document.getElementById('invprop3value" + x + "').value;");
    eval("var inv3b" + x + " = document.getElementById('invprop3debt" + x + "').value;");
    eval("var port1" + x + " = document.getElementById('shareport1value" + x + "').value;");
    eval("var port2" + x + " = document.getElementById('shareport2value" + x + "').value;");
    eval("var port3" + x + " = document.getElementById('shareport3value" + x + "').value;");
    eval("var bank1" + x + " = document.getElementById('cash1value" + x + "').value;");
    eval("var bank2" + x + " = document.getElementById('cash2value" + x + "').value;");
    eval("var bank3" + x + " = document.getElementById('cash3value" + x + "').value;");

    eval("var nw" + x +  = '+res1a'+ x + '- +res1b'+ x + '+ +res2a'+ x + '- +res2b'+ x + '+ +res3a'+ x + '- +res3b'+ x + '+ +inv1a'+ x + '- +inv1b'+ x + '+ +inv2a'+ x + '- +inv2b'+ x + '+ +inv3a'+ x + '- +inv3b'+ x + '+ +port1'+ x + '+ +port2'+ x + '+ +port3'+ x + '+ +bank1'+ x + '+ +bank2'+ x + '+ +bank3' + x + ';');

    eval("postWorth" + x "(nw" + x + ");");
}

---

这可能需要在架构级别上做一些工作——您可能更适合使用类似knockout.js的东西来设置一个动态视图模型，该模型也可以动态更改html。。。话虽如此，要回答您当前的问题，即如何修改函数以接受参数并使其更具动态性和简单性：

只需使用一个对象来保存动态数量的属性

function calcNet(numDirectors) {
    var formVals = {}, totalNet = 0;
    for (var i = 1; i <= numDirectors; i++) {
        formVals["res" + i + "a"] = document.getElementById('residence' + i + 'value').value;
        formVals["res" + i + "b"] = document.getElementById('residence' + i + 'debt').value;
        formVals["inv" + i + "a"] = document.getElementById("invprop" + i + "value").value;
        formVals["port" + i] = document.getElementById("shareport" + i + "value").value;
        formVals["bank" + i] = document.getElementById("cash" + i + "value").value;
        // you could use the '+' unary here like in your example, but I just like using Number() 
        formVals["net"+i] = Number(formVals["res" + i + "a"]) - Number(formVals["res" + i + "b"]) +
            Number(formVals["inv" + i + "a"]) + Number(formVals["bank" + i]);
        totalNet += formVals["net"+i];
    }
    // assuming you also modify postWorth to be a bit more dynamic!
    postWorth(totalNet);
}

函数calcNet（numDirectors）{
var formVals={}，totalNet=0；
对于（var i=1；我是否所有相关字段都位于html中的同一行结构中？通常可以在不使用大量代码的情况下使用DOM遍历来实现这一点。jsfiddle.net中的一个演示将有助于您在这里绝对不需要eval…强烈推荐阅读Eric Lippert的MSDN博客系列“eval is Evil”：John-o，谢谢。我没有想到iter通过所有的董事会讨论…可能是我下一步应该研究的一个功能。对我来说，主要的收获是我可以在结构中添加所需的数字，以创建我需要的特定变量。我不确定我能做到这一点。我会给你一个加号，但显然我太绿了，不能相信我有这种能力。谢谢你每年一次的帮助增益。@jgcrosman没问题！您可以通过查找javascript动态变量或类似的内容来找到这类内容的更多信息，如果您不关心单个值（只是净值），您可以向每个输入（资产或债务）添加一个类，然后使用querySelectorAll（或jquery选择器）作为额外建议要获得与类匹配的每个输入，您只需循环数组中的值，将总数相加。我知道您在说什么，尽管我在jquery上遇到了一些复杂且特定于我需要的问题。Javascript很笨拙，但可以完成任务（当然是使用PHP）.在这种情况下，我正在建立一个新的帐户表单，了解你的客户访谈和数据库加载。因此，我们需要所有有趣的变量来完成我们的投资者档案。
var o={ item:null, item2:null};
var sum=0;


for (var i in o){
  var val=whatever(i);
  o[i]= val;
  sum+=val;
}