從循環中的輸入創建數組JavaScript

Question

我目前將手風琴中的用戶輸入保存到數組中。

我的手風琴是動態的，在點擊，將創建具有輸入字段的另一個手風琴柱：

var i = 1 ; 
     function AddPanel() 
     { 
     $('.accord').append('<h3 style="background:none;background-color:#C8C8C8 ;">Job Nr.'+i+'</h3>' 
      +'<div style="background:none;background-color:#E0E0E0;">' 
       +'<div>' 
        +'<form name="myForm">' 
         +'<table class="wrapper">' 
          +'<tr>' 
           +'<td style="text-align: left">First Digit:' 
           +'<div> <input type="text" name="Job['+i+'][0]" /></td>' 
           +'<td style="text-align: left">System:'  
           +'<div> <input type="text" name="Job['+i+'][1]" /></td>' 
           +'<td style="text-align: left">SAP Modul:' 
           +'<div> <input type="text" name="Job['+i+'][2]" /></td>' 
          +'</tr>' 
          +'<tr>' 
           +'<td style="text-align: left">Country:' 
           +'<div> <input type="text" name="Job['+i+'][3]" /></td>' 
           +'<td style="text-align: left">Duration:' 
           +'<div> <input type="text" name="Job['+i+'][4]" /></td>' 
           +'<td style="text-align: left">Step Number:' 
           +'<div> <input type="text" name="Job['+i+'][5]" /></td>' 
          +'</tr>' 
          +'<tr>' 
           +'<td style="text-align: left">Optional Text:' 
            +'<div>' 
            +'<textarea align="left" name="Job['+i+'][6]" cols="20" rows="2"></textarea>' 
            +'</div>' 
           +'</td>' 
          +'</tr>' 
         +'</table>' 
        +'</form>' 
       +'</div>' 
      +'</div>') 
     $('.accord').accordion("refresh"); 
     i++; 
     }   

理論上用戶可以動態讓數以百計的投入二維數組。

我現在的問題是：我將如何能夠存儲並稍後在環境中檢索2d數組的所有輸入？

我試了一下躺在它是由tborychowski建議：`

 var form = document.getElementsByName('myForm'); 
     field = form.elements['Job[0][0]']; 
     formData = [], i = 0, j = 0; 

     while (field) { 
     formData[i] = []; 
     j = 0; 
     while (field) { 
     formData[i].push(field.value); 
     field = form.elements['Job[' + i + '][' + (++j) + ']']; 
     } 
     field = form.elements['Job[' + (++i) + '][0]']; 
     } 
     console.dir(formData); 
     ` 

我在許多不同的方式嘗試這樣做，一派幾個小時，但我無法得到它的工作。

對不起，我是一個真正的初學者。

在此先感謝！

Answer 1

我創建了一個你可以做的演示（例子）。 基本思想（如果我理解正確的話）是使用循環索引，這樣命名錶單字段：

<input type="text" name="Job[0][0]"/> 
<input type="text" name="Job[0][1]"/> 

所以第一個數字將是組/設置索引，第二個 - 內場指數該組/集合。

比 - 你只是通過這些領域，不管有多少套或領域中一組需要循環 - 你可以收集所有的值在數組中，例如：

var form = document.getElementById('myForm'), 
    field = form.elements['Job[0][0]'], 
    formData = [], i = 0, j = 0; 

while (field) { 
    formData[i] = []; 
    j = 0; 
    while (field) { 
     formData[i].push(field.value); 
     field = form.elements['Job[' + i + '][' + (++j) + ']']; 
    } 
    field = form.elements['Job[' + (++i) + '][0]']; 
} 

console.dir(formData); 

我沒有」在這裏使用jquery（用jquery它可能更容易）。

這是你在找什麼？

DEMO

Answer 2

取決於你的範圍，你可以做這樣的事情：

var a0 = 6, a1 = 5, a2 = 4, a3 = 2; 

for (var i = 0; i < 4; i++) { 
    console.log(window['a' + i]); 
} 

所以 - 如果window是你的變量都在範圍內，您可以在例如使用它像上面。

否則 - 如果這是不可能的 - 你可以創造價值，而不是單獨的數組變量，像這樣：

'<input type="text" name="Job['+i+'][]" />' 

如果你選擇這種方式 - 我會做的是增加一個索引類（以使它更容易爲jQuery的，到包裝元素（涵蓋同一指數的所有輸入），例如：

'<table class="inputs' + i + '">'+ 
    ---- inputs go here ---- 
'</table>'+ 

然後通過他們循環，得到的值，就像這樣：

var jobs = [], idx = 0, inputs = $('.inputs' + idx); 

while (inputs.length) { 
    inputs.find('input[name^=Job]').function(index, inputField) { 
     jobs[idx][].push($(inputField).val()); 
    }); 

    idx++; 
    inputs = $('.inputs' + idx); 
}