我是javascript新手,我创建了2个函数,createInput()会在调用时创建带有名称参数的输入框,并将它们附加到标记newTwo()上,后者会使用两个不同的名称两次调用createInput()。

我似乎无法为这两个名称元素提供索引,并使其在每次调用newTwo()时递增。我需要这样做,以便可以成对地跟踪字段值。

function createInput(name)
{

    var input = document.createElement("input");

    input.setAttribute("type", "text");
    input.setAttribute("name", name);

    var form = document.getElementById("foobar");

    form.appendChild(input);

}

function newTwo()
{
    var $i = 0;
    createInput("first_name[" + $i + "]");
    createInput("last_name[" + $i + "]");
    $i++;
}


当我调用newTwo()时,将使用数组索引创建输入字段,如下所示。

<input type="text" name="first_name[0]" />
<input type="text" name="last_name[0]" />


如果我再次调用它,接下来的两个字段将是

<input type="text" name="first_name[0]" />
<input type="text" name="last_name[0]" />


我上一个第二个电话的期望输出是

<input type="text" name="first_name[1]" />
<input type="text" name="last_name[1]" />


有什么建议么?提前致谢。

最佳答案

由于您在函数内部具有var $i = 0;,因此您将在每次运行该函数时创建一个新变量并将其初始化为0。如果要使用在函数调用之间保持其值的变量,则需要在函数外部声明它。例如:

var $i = 0;
function newTwo()
{
    createInput("first_name[" + $i + "]");
    createInput("last_name[" + $i + "]");
    $i++;
}


或者,如果您真的想避免使$i全局化,则可以围绕它创建一个IIFE,如下所示:

var newTwo = (function() {
    var $i = 0;
    return function() {
        createInput("first_name[" + $i + "]");
        createInput("last_name[" + $i + "]");
        $i++;
    };
})();


请注意,此版本与以前的版本之间存在细微的差异。有关更多详细信息,请参见以下问题:


How do JavaScript closures work?
var functionName = function() {} vs function functionName() {}

关于javascript - 在JavaScript中添加到具有指定索引的数组,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/23252990/

10-12 13:00
查看更多