無限の量のオプションメニューにJSON配列を追加するにはどうすればよいですか？

Question

WebInterfaceの場合、JavaScriptを使用した無限のオプションメニューにJSON配列を追加する必要があります。私はまだJavaScriptを使ってプログラミングするのが初めてで、あなたが私を助けてくれると思っていました。

オプションメニューにJSON配列を追加するためのソリューションが見つかりました。そのため、無限のオプションメニューで動作するようにいくつかのコードを追加しようとしました。

私は2個の選択のタグを持っている：

<select id="selection1" class="selectionMenu"> </select> 
<select id="selection2" class="selectionMenu"> </select> 

次のコードは、私が私のために動作しませんを選択し、メニューの両方にオプションのタグを追加するために働いたスクリプトがあります。

<script> 

var arr = [ 
    'selection1', 
    'selection2' 
] 

var arrLen = arr.length - 1; 

for (j = 0; j < arrLen; j++) { 

    var arrElm = arr[j]; 

    var select = doucment.getElementById(arrElm); 

    var text = '{"nrrps":[' + 
    '{"dbC":"PI1","PIIP":"192.168.2.17" },' + 
    '{"dbC":"PI2","PIIP":"192.168.2.18" },' + 
    '{"dbC":"PI3","PIIP":"192.168.2.19" }]}'; 

    for (i=0; i < text.length; i++;) { 

    var opt = document.createElement('option'); 

    var counter2 = i + 1; 

    obj = JSON.parse(text); 

    var insertText = obj.nrrps[i].dbC + " " + obj.nrrps[i].PIIP + " "; 

    var optVal = obj.nrrps[i].dbC; 

    opt.value = optVal; 

    opt.innerHTML = insertText; 

    opt.setAttribute("class", "sOption"); 

    select.appendChild(opt); 

    } 

} 

</script> 

コードを実行すると、JSON配列は最初の選択タグに挿入されますが、2番目のタグには挿入されません。どうしてか分かりません。さらに、オプションを選択した後、すべての選択タグの価値を得る可能性はありますか？

私はあなたにこれを手伝っていただければ幸いです。

ありがとうございます！

Answer 1

第一：第二for loopであなたはそれがするので、テキストのlengthをチェック：@kameshの長さがすでにapplied -1あなたに述べたようにがまずそうj <= arrLen;

for (j = 0; j <= arrLen; j++) { ... } 

第二は、以下のように演算子を変更テキストの長さを122 somethingにしてください。間違っているので、JSON.parse()を適用し、次にようなオプションの長さを見つけてください。

var obj = JSON.parse(text); 

for (i=0; i < obj.nrrps.length; i++) {...} 

var arr = [ 
 
\t 'selection1', 
 
\t 'selection2' 
 
\t ] 
 

 
var arrLen = arr.length - 1; 
 

 
for (j = 0; j <= arrLen; j++) { 
 

 
    var arrElm = arr[j]; 
 

 
    var select = document.getElementById(arrElm); 
 

 
    var text = '{"nrrps":[' + 
 
\t \t \t '{"dbC":"PI1","PIIP":"192.168.2.17" },' + 
 
\t \t \t '{"dbC":"PI2","PIIP":"192.168.2.18" },' + 
 
\t \t \t '{"dbC":"PI3","PIIP":"192.168.2.19" }]}'; 
 
    
 
    //console.log(text.length); 
 
    
 
    var obj = JSON.parse(text); 
 
    
 
    for (i=0; i < obj.nrrps.length; i++) { 
 

 
    var opt = document.createElement('option'); 
 

 
    var counter2 = i + 1; 
 

 
    var insertText = obj.nrrps[i].dbC + " " + obj.nrrps[i].PIIP + " "; 
 

 
    var optVal = obj.nrrps[i].dbC; 
 

 
    opt.value = optVal; 
 

 
    opt.innerHTML = insertText; 
 

 
    opt.setAttribute("class", "sOption"); 
 

 
    select.appendChild(opt); 
 

 
    } 
 

 
}

<select id="selection1" class="selectionMenu"> </select> 
 
<select id="selection2" class="selectionMenu"> </select>

Answer 2

すでに配列の長さから1を引いています。だから、< = array.lengthまでforループを実行してください。

.... 
.... 
for (j = 0; j <= arrLen; j++) { 

    var arrElm = arr[j]; 
.... 
....