在JavaScript中添加到具有指定索引的數組

Question

我是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]" />

有什么建議么？ 提前致謝。

Answer 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++;
    };
})();

請注意，此版本與以前的版本之間存在細微的差異。 有關更多詳細信息，請參見以下問題：

• JavaScript閉包如何工作？
• var functionName = function() {}與function functionName() {}