javascriptを使用してhtmlのドロップダウンリストに項目を追加します

私はこのjavascript + htmlをドロップダウンメニューに入力しますが、それは機能しません。何か間違っていますか？スクリプトが<head>にあるので、私は、ドロップダウンメニューは、ページのロードに満たされたい注意javascriptを使用してhtmlのドロップダウンリストに項目を追加します

<!DOCTYPE html> 
    <html> 
    <head> 
    <script> 
    function addList(){ 
    var select = document.getElementById("year"); 
    for(var i = 2011; i >= 1900; --i) { 
    var option = document.createElement('option'); 
    option.text = option.value = i; 
    select.add(option, 0); 
     } 
    } 
    </script> 
    </head> 

    <body> 

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

    </body> 
    </html>

出典

2013-08-24 Oyindamola ' Funmi Oni

[どのように私はJavaScriptでHTMLフォームのドロップダウンリストにオプションを追加する]の可能複製（http://stackoverflow.com/questions/10992261/how-do-：あなたは最高のDocumentFragmentでこれを行いますi-add-an-html-form-drop-list-with-javascript） –

@HashemQolami私はボタンを持っていないので、どこに関数を置くのか混乱しています。 –

、あなたはwindow.onloadでそれをラップする必要があります。

window.onload = function() { 
    var select = document.getElementById("year"); 
    for(var i = 2011; i >= 1900; --i) { 
     var option = document.createElement('option'); 
     option.text = option.value = i; 
     select.add(option, 0); 
    } 
};

ます。また、この方法でそれを行うことができます

<body onload="addList()">

出典

2013-08-24 09:50:24 Kabie

あなたはこの機能を定義したと思います。あなたはどこにでもそれを誘発していません。

くださいその定義の後

window.onload = addList();

を行うか、他のイベント

にそれをトリガー

このfiddle

出典

2013-08-24 09:51:46 mithunsatheesh

はこの試してみてください参照してください。

select.appendChild（オプション）;

出典

2013-08-24 09:54:37 Alex

値がドロップダウンリストに追加します。この

<script type="text/javascript"> 
    function AddItem() 
    { 
     // Create an Option object  
     var opt = document.createElement("option");   

     // Assign text and value to Option object 
     opt.text = "New Value"; 
     opt.value = "New Value"; 

     // Add an Option object to Drop Down List Box 
     document.getElementById('<%=DropDownList.ClientID%>').options.add(opt); 
    } 
<script />

を試してみてください。

出典

2014-02-06 10:59:17 Golda

は、より高いパフォーマンスを得るために、私はこれをお勧めします。

var select = document.getElementById("year"); 
var options = []; 
var option = document.createElement('option'); 

//for (var i = 2011; i >= 1900; --i) 
for (var i = 1900; i < 2012; ++i) 
{ 
    //var data = '<option value="' + escapeHTML(i) +'">" + escapeHTML(i) + "</option>'; 
    option.text = option.value = i; 
    options.push(option.outerHTML); 
} 

select.insertAdjacentHTML('beforeEnd', options.join('\n'));

これは、特にオプションのより多くのために、かなりのプロセスをスピードアップし、それぞれのappendChild、後に再描画を回避します。手で文字列を生成するためのオプション

：

function escapeHTML(str) 
{ 
    var div = document.createElement('div'); 
    var text = document.createTextNode(str); 
    div.appendChild(text); 
    return div.innerHTML; 
}

しかし、私はすべての方法のこれらの種類を使用することはありません。
粗末なようです。

var docfrag = document.createDocumentFragment(); 

for (var i = 1900; i < 2012; ++i) 
{ 
    docfrag.appendChild(new Option(i, i)); 
} 

var select = document.getElementById("year"); 
select.appendChild(docfrag);

出典

2015-03-11 13:53:42

追加するのではなく値を置き換えたいのですか？どうすればいい？ – Eli

javascriptを使用してhtmlのドロップダウンリストに項目を追加します

答えて

関連する問題