セレクトメニュー(オプションメニュー)ボタン付き
Javascriptで値を取得、指定URL にジャンプ。
サンプルソース
<html>
<head>
<title>セレクトメニュー(オプションメニュー)の値</title>
<script language="JavaScript">
<!--javascript123
function selec() {
var List = document.getElementById("list");
index_nub =
// 取得した値をalert表示
alert("項目の参照番号: "+index_nub+"\noption value: "
+Opt_val+"\nタイトル: "+Txt_val);
// 確認ダイアログの表示
Resp = confirm(Txt_val+" にジャンプします。\n\tよろしいですか?");
if ( Resp == true ){
// 取得した移動先にジャンプ
}
}
// -->
</script>
</head>
<body>
<form>
<select id="list">
<option ="http://www.google.com/">Google</option>
<option value="http://www.moshimo.com/top/227349/" >moshi market</option>
<option value="http://www.baidu.jp/">百度(バイドゥ)</option>
<option value="http://ja.wikipedia.org/wiki/">Wikipedia(百科事典)</option>
<option value="http://www.yahoo.co.jp/">Yahoo!JAPAN</option>
</select>
<input onclick="selec()" type="button" value="GO"
/>
</form>
</body>
</html>
選択されている項目の参照番号
var List = document.getElementById("list");
index_nub =
項目の数は"0"から数え始めます。百度(バイドゥ)の
場合は"2"を返します。
option valueの値
optionタグの 属性は送信する値です。
では各項目の"URL"です。項目の値
セレクトボックスに表示されるタイトルの値です
window.location.href ="URL";
指定したURLにジャンプします。
には選択した項目のURLが入っているのでそのサイトに移動します。
セレクトメニューの設置 値の取得 onchangeイベント
window.confirm() 確認ダイアログ
さくらのレンタルサーバ スタンダード
無料レンタルカウンター「デジデジ」
ロリポップ!なら初心者でも安心!
ホームページ簡単作成 「ホムペロリ!」、「woopa!」
CGI簡単設置 「CGI CANDYBOX!」が無料で使えます!!