セレクトメニュー項目を追加する

説明

セレクトメニューで表示される項目を追加するにはnew Option()として追加する項目名とvalueプロパティ値を設定します。複数の項目を追加する場合には配列などに追加項目を入れておき繰り返し追加するようにします。また、項目を追加する際には、何番目の項目に追加するかを指定する必要があります。
JavaScriptテクニック ブック  詳しい解説などはJavaScriptテクニック ブックを参照してください。

サンプルコード [実行]

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=utf-8">
<title>JavaScript Sample</title>
<link rel="stylesheet" type="text/css" href="main.css" media="all">
<script type="text/javascript" src="main.js"></script>
</head>
<body>
<h1>セレクトメニュー項目を追加する</h1>
<form action="./jump.cgi" method="get" id="mainForm" name="mainForm">
<select id="jump"></select>
</form>
</body>
</html>

window.onload = function(){
var selObj = document.getElementById("jump");
var optionData = [
{ text:"Yahoo", value:"http://www.yahoo.co.jp/"},
{ text:"Google", value:"http://www.google.co.jp/"},
{ text:"OpenSpace", value:"http://www.openspc2.org/"}
];
for (var i=0; i<optionData.length; i++){
selObj.options[i] = new Option(optionData[i].text, optionData[i].value);
}
selObj.onchange = function(){
location.href = this.value;
}
}