JavaScriptを用いたホームページ[リストボックス]

ポイント1)フォームおよび部品の名前を定義する。

ポイント2)JavaScriptを記述する。

ポイント3)アクションの追加 onClick="2)のファンクション名"


作成場所: X:ドライブのフォルダー「学籍番号f」 ファイル名:rei6.htm (あらかじめ画像ファイルは同フォルダーにコピーしておくこと)

例題6完成品はここをクリック

Step1)フォームおよび部品の名前を定義する。

例題におけるフォーム名:F1 (注意:フォームは1つ。2つ以上に分けないこと。)

部品type
select
button
name
S1
push
option text (一覧) 上表示 下表示 左表示 右表示  
option value   up.gif down.gif left.gif right.gif  

Dreamweaverでは、部品「リスト/メニュー」を使い、そのプロパティ画面で、下図のように作ります。

1)「リスト値」をクリックし、「リスト値」ウインドウ で、項目ラベル(option text)、値 (option value)を+で加えていくことで、この部品を作成する。

Step2)JavaScriptを記述する。


document,F1.S1.selectedIndexとは、フレームF1のselect部品S1の選んだ番号(「リスト値」ウインドウで、入っている順番に0,1,2とつけられている)のことです。この選ばれた番号の項目ラベルが、document.F1.S1.options[document,F1.S1.selectedIndex].textであり、
値が、document.F1.S1.options[document,F1.S1.selectedIndex].valueです。上の文法では、document,F1.S1.selectedIndexをいちいち書くのは大変なので、var n=でnという変数を定義して、代わりにnを[]の中に使っています。

Step3)アクションの追加 onClick="2)のファンクション名"

部品type button
name push
アクション onClick="func()"