使用Javascript修改選擇字段選項

我正在嘗試創建一個Javascript函數，它將從一個選擇字段中取值，然後使用它來比較JSON數組。如果有任何數組元素與用戶選擇的值匹配，那麼函數會將這些值添加到另一個選擇字段。使用Javascript修改選擇字段選項

邏輯：使用「平變化」 HTML屬性從選擇字段

獲取用戶選擇的值

激活功能如果數組值==選擇比較這個值來JSON陣列
值，附加到其他選擇字段

代碼：

//this function modifies a select field depending on what value was selected by its predecessor 
     function tariffs() 
     { 
      //variable selection equals the selected value chosen by the user in that field 
      var selection = document.getElementById('tariff_net').options[document.getElementById('tariff_net').selectedIndex].value 

      //for loop to go through JSON values to compare with the value chosen by the user 
      for(var i = 0; i < values.preset_name.length ; i++) 
       { 
        //if the JSON value equals the user selected value 
        if (values.preset_name[i] == selection) 
        { 
         //append it to the "tariff_name" select field 
         var option = values.preset_name[i]; 
         var selectfield = document.getElementById('tariff_name'); 
         selectfield.appendChild(option); 
        } 
       } 


     }

下面是該兩個選擇字段的截圖（在上面的人會影響到下選擇字段選項）

http://i.imgur.com/B0eHS.png

enter image description here

目前我的代碼不工作，我得到一個Javascript錯誤：

Could not convert JavaScript argument arg 0 [nsIDOMHTMLInputElement.appendChild] [Break On This Error] selectfield.appendChild(option);

我也想知道如何才能使Javscript刷新所有值的選擇字段，然後重新填充它。這將防止每當函數被調用時大量重複的選項。

由於

來源

2012-01-12 kaleeway

你可以發佈一個[JS小提琴演示]（http://jsfiddle.net）顯示你到目前爲止的嘗試嗎？ – 2012-01-12 10:11:45

@DavidThomas我可以嘗試，但問題是我的領域是使用PHP生成的，所以是我的JSON – kaleeway 2012-01-12 10:14:05

然後嘗試看看您是否可以儘可能地使用靜態HTML/JS來模擬。我知道這並不理想，但沒有看到發生了什麼事情，很難提供幫助。而且，在沒有Ajax的情況下再現問題時，至少可以知道錯誤來自何處。 – 2012-01-12 10:17:02

appendChild需要的元素，而不是字符串。選擇選項有一個構造函數來幫助你：

var option = new Option(values.preset_name[i]); //Dom element instead of a string 
var selectfield = document.getElementById('tariff_name'); 
selectfield.appendChild(option);

來源

2012-01-12 11:32:42 Dennis

這解決了它謝謝你，所以我沒有意識到，任何傳遞給dom的東西都需要轉換爲對象/元素。現在有道理！謝謝！ – kaleeway 2012-01-12 11:40:59

任何想法如何清除選擇字段？每次我運行這個功能？ – kaleeway 2012-01-12 11:45:24

使用Javascript修改選擇字段選項

回答

相關問題