複数のプルダウンの連動とリンク
複数の連動するプルダウンを作成し、さらに最後のページをリンクで
飛ばしたいのですが、java初心者のためそのように記述してよいのか
分かりません。
３つのプルダウンであれば他のページに記述例があったのですが、
増やす時などにどこをいじればよいか分かりませんでした。
下記ソースは他サイトからのものですが、最後のプルダウンにリンク貼れますか？
他の記述でもかまいませんので教えてください。
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS" />
<script type="text/javascript"><!--
function ResetOptions( index )
{
var select = document.getElementById( "select" + index );
while( select ) {
for( var i = 0, len = select.length; i < len; i++ ) {
select.options[0] = null;
}
CreateOption( select, "", "項目" + ( index - 1 ) + "を選択してください" );
index++;
select = document.getElementById( "select" + index );
}
}
function CreateOption( select, key, value )
{
var option = document.createElement( "OPTION" );
option.setAttribute( "value", key );
var text = document.createTextNode( value );
option.appendChild( text );
select.appendChild( option );
}
function CreateOptions( index, value, pleaseSelect )
{
var select = document.getElementById( "select" + index );
if( ! select ) {
return;
}
for( var i = 0, len = select.length; i < len; i++ ) {
select.options[0] = null;
}
var option, text, list;
if( index > 1 ) {
if( value ) {
list = dataList[index-1][value];
}
else {
ResetOptions( index );
return;
}
}
else {
list = dataList[0];
}
if( pleaseSelect ) {
CreateOption( select, "", "↓選択してください" );
}
for( var key in list ) {
CreateOption( select, key, list[key] );
}
ResetOptions( index + 1 );
}
var dataList = [
{ "asia": "アジア", "europe": "ヨーロッパ", "south_america": "南米" },
{
"asia" : { "japan": "日本", "korea": "韓国" },
"europe": { "italy": "イタリア", "spain": "スペイン", "sweden": "スウェーデン" },
"south_america": { "brazil": "ブラジル", "argentina": "アルゼンチン" }
},
{
"japan": { "": "38位" },
"korea": { "": "45位" },
"italy": { "": "3位" },
"spain": { "": "4位" },
"sweden": { "": "30位" },
"brazil": { "": "2位" },
"argentina": { "": "1位" }
}
];
window.onload = function() {
CreateOptions( 1, null, true );
ResetOptions( 2 );
};
//--></script>
</head>
<body>
<h1>サッカー世界ランク</h1>
<p>地域：<select id="select1" onchange="CreateOptions( 2, this.options[this.selectedIndex].value, true );"></select></p>
<p>国：<select id="select2" onchange="CreateOptions( 3, this.options[this.selectedIndex].value, false );"></select></p>
<p>順位：<select id="select3"></select></p>
</body>
</html>
