Quantcast
Channel: JAVAスプリクト初心者入門講座
Viewing all articles
Browse latest Browse all 15

プルダウンメニューの表示

$
0
0

リンクの多いページによっては、そのリンク先をプルダウンメニューなどを使って選ばせて、そうしてリンク先に飛ばせる、という手法を使ったページがあります。

何かの解説や講座を行っているページに多いですね。そういったページでは扱う内容も豊富なので、ジャンルごとに分けて、細かいメニューはプルダウンメニューを使って、といったようになっています。

この機能も、JAVAスプリクトを使って簡単に実装することが出来ます。理論としては、プルダウンメニューの上から順に配列で番号をつけて、選んだ項目の番号を代入してそこで条件判断している、という感じです。

それでは、サンプルです。以下のサンプルはすべて<body>タグ内に記述することになります。

<script type="text/javascript">
<!--
function GoLocation(){
mySelectValue = document.myForm.myMenu.selectedIndex;
location.href = document.myForm.myMenu.options[mySelectValue].value;
}
//-->
</script>

<form name="myForm">
<select name="myMenu">
<option value="http://www.google.co.jp">Google
<option value="http://www.yahoo.co.jp">Yahoo! JAPAN
<option value="http://www.microsoft.com">Microsoft
<option value="http://www.apple.com/">Apple
<option value="http://www.ibm.com">IBM
</select>
<input type="button" value="ジャンプ" onClick="GoLocation()">
</form>

さて、上記を実行してみましょう。ちゃんとプルダウンメニューが表示され、選択したページに飛べたでしょうか。 プルダウンメニューを活用して、見やすいページ作りをしましょう。


Viewing all articles
Browse latest Browse all 15

Trending Articles