プルダウンメニューを利用したアンカー

次のプルダウンメニューはリンクになっています。選択するだけでリンク先に移動します。

• FORM要素を次のように定義します。
• 各SLECT要素の値には表示したいページのURLを指定します。
• 内容が変更されるとonChangeイベントが発生します。このイベントが発生したときにJavaScriptの文を実行します。

<FORM>
<SELECT onchange="location=this.options[this.selectedIndex].value">
  <OPTION selected>URL </OPTION>
  <OPTION value="http://www.asahi.com/">asahi.com </OPTION>
  <OPTION value="http://www.yahoo.co.jp/">Yahoo!Japan </OPTION>
  <OPTION value="http://www.google.com/">Google </OPTION>
  <OPTION value="http://www.neec.ac.jp/">片柳学園 </OPTION>
</SELECT>
</FORM>

次の文がJavaScriptの部分です。

location=this.options[this.selectedIndex].value

これを次のように変えると新しいウィンドウを開いてリンク先を表示します。

window.open(this.option[this.selectedIndex].value)

次のプルダウンメニューはそれぞれのリンクを新しいウィンドウで開きます。