MB-Support

パソコン初心者のサポートページ

JavaScript でコンボボックスを作成


先日、馬車道で話たコンボボックスを作成してみました。 左のボックスで項目を選択して「GO」をクリックする事で選択したページに飛びます。 「GO」ボタンを排除してボックスで選択した時点でリンク先に飛ばす事も可能です。

「JavaScript」を使用してますが、google の無人ロボットが巡回不能という欠点(噂)があり使用していないのですが・・・ しかも、価値あるホームページを作成するほどの腕になればカッコイイかも知れませんが、今の段階で MB-Support が使うには早い様な気がします。 注 押したら「戻る」で戻って来て下さい。「target="_blank"」が通用しません。 「head」の「SCRIPT」宣言で指定するのでしょうが、やり方が分からないです。



ヘッダーに挿入するJavaScript
<script language="JavaScript">
<!--
function jumpMenu1(){
location=(document.link1.list1.options
[document.link1.list1.selectedIndex].value);
}
//-->
</script>
<body> 〜 </body> に記述するフォームソース
<form name="link1">
<select name="list1">
<option value="URL" selectted>日記 2003/05</option>
<option value="URL">日記 2003/04</option>
<option value="URL">日記 2003/03</option>
<option value="URL">日記 2003/02</option>
<option value="URL">日記 2003/01</option></select>
<input type="button" VALUE="GO" onClick="jumpMenu1()"></form>


それから、NAME を使用する事で同一ページ内でリンクを張る事ができます。 2003 年 6 月の日記よりチャプター左に ▼TOPと表示されていますよね。このボタンをクリックする事で下の方にいる時も、同じページのトップに移動する事ができる様になりました。 商用ページを作成してて「ジャンル選択」などで利用してから取り入れましたが、これを利用すれば、日にち指定でリンク先に飛ばす事がで きます。(以下のフォームは、ホームページの構成が現在は異なっているため、正常に動作しません。)




実際に作成してみると便利ですね・・・ 1 つのページに複数作る場合は「head」で「FORM NAME」「SELECT NAME」「jumpMenu()」を複数定義する必要があります。 もちろん「JavaScript」に対応していないか、ブラウザ設定で無効にしている場合はページ自体が表示されないか、エラーが出る事になりますが。 管理人は「JavaScript」の知識は無いのですが、基本的に「cgi」がサーバー側で処理するのに対して「JavaScript」はユーザーのブラウザー側での処理になります。 ゆえに、自宅サーバー管理者にとっては負担が無くいいのですが、ユーザー側のマシンスペックに依存します。 チャットでフリーズ起こすのもこれが原因です。もうちょっと研究してみます。





Copyright © 2019 MB-Support パソコン初心者のサポートページ All Rights Reserved.

管理人のご挨拶プライバシーポリシー著作権/免責事項