JavaScript的：爲什麼新的下拉未填充值

Here is my code: 

     <script language="javascript"> 
     var counter =0,temp,m,cloneNodem; 
     function getVtierDefList(){ 
      var vtierDefList = var vtierDefList = [{"label":"d1nis1w20","value":"28914"},{"label":"d1nis1m13","value":"28915"},{"label":"d1nis2d9","value":"28661"},{"label":"d1nis3d1","value":"28916"},{"label":"d1nis1a1","value":"27238"},{"label":"d1nis1a13","value":"28917"},{"label":"s2nis1d0","value":"28660"},{"label":"s2nis1a0","value":"28659"},{"label":"t3nis1d0","value":"27237"}];; 
      return vtierDefList; 
     } 
     </script> 
     </head> 
     <body onload="load();"> 
     <div id="doc"> 
     <div id="main"> 
     <table id="vtier#1"> 
      <tr> 
       <td><button onclick="delVtier(this);return false;" /></td> 
       <td>1.Vtier Name: <select id="vtier" name="vtierSelect" onchange="doAjax(this);return false;"> 
        <option selected="selected" value="-1">Any</option> 
       </select></td> 
      </tr> 
     </table> 
     <div id="accountarea" > 
     </div> 
     </div> 
     </div> 
     <div id="plus"><button onclick="addVtier();return false;"/></div> 

     </body> 
     </html> 
    <script language="javascript"> 
    function addVtier() { 
      m = document.getElementById("main"); 
     cloneNodem = m.cloneNode(true);  
     temp = cloneNodem.cloneNode(true); 
     document.getElementById("main").appendChild(temp); 
       counter++; 
     fillDropDown(counter); 
    } 
    function load() { 
     var vtierSelectedList = document.getElementsByName("vtierSelect"); 
     addDropDownValues(getVtierDefList(), vtierSelectedList[0],"-1"); 
     } 
     function addDropDownValues(Elements,DropDwn,SelectID) 
     { if(DropDwn.options){ 
       DropDwn.options.length = 1 
        } 
      for(var i=0;i<Elements.length;i++) 
      { 
       var addOption = new Option(); 
       addOption.value = Elements[i].value; 
       addOption.innerHTML = Elements[i].label; 
       if(addOption.value == SelectID)addOption.selected = true; 
       DropDwn.appendChild(addOption); 
      } 
     } 
    function fillDropDown(dropDwn) { 

     var vtierSelectedList = document.getElementsByName("vtierSelect"); 
     vtierSelectedArray = new Array(vtierSelectedList.length); 
     var vtierDefList = getVtierDefList(); 
     for(var k=0;k<vtierSelectedList.length;k++) { 
     vtierSelectedArray[k] =vtierSelectedList[k].options[vtierSelectedList[k].selectedIndex].value ; 

     } 
     var diff = diffArray(getVtierDefList(), vtierSelectedArray); 
     addDropDownValues(diff,vtierSelectedList[dropDwn],"-1"); 
} 
// this function diffArray just finds the difference between the two arrays 
function diffArray(a, b) { 
     var seen = [], diff = []; 
     for (var i = 0; i < b.length; i++) 
      seen[b[i]] = true; 
     for (var i = 0; i < a.length; i++) 
      if (!seen[a[i].value]) 
       diff.push(a[i]); 
     return diff; 
    } 
    </script>

現在我的問題是，當這個代碼填補了第一個下拉下拉列表爲什麼它不填寫的下拉列表與新計算陣列隨後的下拉菜單在下拉框中沒有已經選擇的元素？JavaScript的：爲什麼新的下拉未填充值

來源

2012-01-30 linusunis fed

Ughhhhh代碼轉儲。 http://www.jsfiddle.net/並給出一些解釋。什麼工作？什麼不？問題似乎在哪裏？你有什麼嘗試？ JSFiddle雖然是一個很好的開始。它是堆棧溢出的最好的朋友（反正是html，css，js部分） – 2012-01-30 20:09:56

不完全確定，但它看起來像只做'var vtierSelectedList = document.getElementsByName（「vtierSelect」）;'當頁面加載時，而不是當你添加一個新的時更新它。 – 2012-01-30 20:25:44

一個可能的問題是如何將選項添加到您的選擇。取而代之的是：

DropDwn.appendChild(addOption);

選擇這樣的：

DropDwn.options.add(new Option(Elements[i].label, Elements[i].value));

你的選擇有一個id，這樣反而

var vtierSelectedList = document.getElementsByName("vtierSelect"); 
addDropDownValues(getVtierDefList(), vtierSelectedList[0],"-1");

通過ID只要選擇這個元素：

var vtierSelectedList = document.getElementsById("vtier"); 
addDropDownValues(getVtierDefList(), vtierSelectedList,"-1");

來源

2012-01-30 20:11:58

JavaScript的：爲什麼新的下拉未填充值

回答

相關問題