JavaScriptのコードでは、選択ボックスにオプションを入れません。

Question

オプションを選択ボックスに入れるはずのjavascriptコードを書いています。選択ボックスのコードの下にある：私のjavascriptのコーディングで

<select id="dayOfTheWeek" name="dayOfTheWeek"></select> 

、私は7つのオプションで選択ボックスを埋めることになっていますpopulateDaysと呼ばれる方法がある - 曜日ごとに1つずつ。そのコードは次のとおりです。

function populateDays() { 
var days = [ "Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday" ]; 
var dayOfWeek = document.getElementById("dayOfTheWeek"); 
var today = (new Date()).getDay(); 

for (var i = 0; i < days.length; i++) { 
    var length = dayOfWeek.options.length; 
    dayOfWeek.add(new Option(days[i], i), length); 
} 
dayOfWeek.selectedIndex = today; 
} 

後でスクリプトでこのメソッドを呼び出します。私はpopulateDaysメソッドの中にalert（）ステートメントを置くので、ブラウザがロードされるときにブラウザがJavaScriptコードを実行することを知っています。

populateDays(); 

何らかの理由で、ページを読み込むと、選択ボックスが完全に空になります。 populateDays（）メソッドがその選択ボックスにオプションをロードしないのはなぜですか？

Answer 1

のErm。そうでない場合は、次の

方法2（jsFiddle example） - innerHTML

function populateDays() { 
    var days = [ "Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday" ]; 
    var dayOfWeek = document.getElementById("dayOfTheWeek"); 
    var today = (new Date()).getDay(); 
    var options = ""; 

    for (var i = 0; i < days.length; i++) { 
    options += '<option value="' + days[i] + '">' + days[i] + '</option>' 
    } 

    dayOfWeek.innerHTML = options; 
    dayOfWeek.selectedIndex = today; 
} 

方法3 - 作成する要素brymckは既にこの1を得たように、プログラム

function populateDays() { 
    var days = [ "Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday" ]; 
    var dayOfWeek = document.getElementById("dayOfTheWeek"); 
    var today = (new Date()).getDay(); 

    for (var i = 0; i < days.length; i++) { 
    var option = document.createElement("option"); 
    option.value = days[i]; 
    var optionText = document.createTextNode(days[i]); 
    option.appendChild(optionText); 
    dayOfWeek.appendChild(option); 
    } 

    dayOfWeek.selectedIndex = today; 
} 

Answer 2

私はこれをIE8で新しいオプションで問題が発生しました。これは他のすべてのブラウザでも機能しました。それはjust fineを動作するはずです、私は次のように置き換えることになったし、それはどこでも働いていた、

selectBox.append("<option value=\"" + value + "\">" + text + "</option>"); 

Answer 3

が鳴ります。 ページを開くときに問題が発生しました。これは誰かを助けるかもしれません：

セレクタが来る前にjavasciptがロードされていると思います。私は自分のコードをjqueryドキュメントの準備ブロックの中に入れて、すべてが動作するようにしました。

体で

：

<select id="selector1" > 
     </select> 

そして、これは私が頭の中で、タグに配置されたJSです：

var optionArr = ["option1", "option2", "option3", "option4"]; 

$(document).ready(function(){ 

    //add array of csv file names to selector element 
    var sel = document.getElementById("selector1"); 

    for(i=0; i < csvFilesArr.length; i++){ 
     //opt += "<option>" + optionArr[i] + "</option>" 
     var option = document.createElement("option"); 
     option.text = optionArr[i]; 
     sel.add(option); 
    } 

});