人力検索はてな
モバイル版を表示しています。PC版はこちら
i-mobile

JavaScriptについて質問です。
プルダウンで選択した値をもってきたいのですがやりかたがわかりません。

<FORM name="selectForm" action="../select.jsp" method="post">
<SELECT size=1 name="selectList" style='{width:200}'>
<OPTION value=-1 selected>-選択-</option>
<OPTION value=1>選択肢1</OPTION>
<OPTION value=2>選択肢2</OPTION>
<OPTION value=3>選択肢3</OPTION>
<OPTION value=4>選択肢4</OPTION>
</SELECT>
<INPUT type="hidden" name="selectID" value="" />
・・・・・略・・・・・・
<INPUT type="image" alt="入力" width=98 src="../select.gif" value="" border="0" />
</FORM>

INPUTタグのname="selectID"のvalueにプルダウンで選択された選択肢のvalueの値をもってきたい。
可能でしょうか?


●質問者: Ryo0524
●カテゴリ:コンピュータ ウェブ制作
✍キーワード:JavaScript name タグ 選択肢
○ 状態 :終了
└ 回答数 : 5/5件

▽最新の回答へ

1 ● きゃづみぃ
●0ポイント

http://javascript123.seesaa.net/article/101434703.html

こちらを参考にして function Selc(Obj)を作成して やってみてください。


2 ● ayakasi08
●0ポイント

Javascriptを使用したら

簡単に出来ますよ。


3 ● mamy1326
●20ポイント

<script type="text/javascript"></p> <p><!--</p> <p>function select_option()</p> <p>{</p> <p> // 選択されているOPTIONの位置(上から何番目か?)</p> <p> var selected_no = document.selectForm.elements[ "selectList" ].selectedIndex;</p> <p> // 選択されているOPTIONのvalue値を取得</p> <p> var selected_option_value = document.selectForm.elements[ "selectList" ].options[ selected_no ].value;</p> <p> // hiddenのvalueに代入</p> <p> document.selectForm.selectID.value = selected_option_value;</p> <p> return true;</p> <p>}</p> <p>//--></p> <p></script>

<FORM name="selectForm" id="selectForm" action="../select.jsp" method="post">

<SELECT size=1 name="selectList" id="selectList" style='{width:200}' onchange="javascript:select_option();">

<OPTION value=-1 selected>-選択-</option>

<OPTION value=1>選択肢1</OPTION>

<OPTION value=2>選択肢2</OPTION>

<OPTION value=3>選択肢3</OPTION>

<OPTION value=4>選択肢4</OPTION>

</SELECT>

<INPUT type="hidden" name="selectID" value="" />

</FORM>

1.scriptタグ内で、プルダウンが変更されるたびに動くjavascriptの関数を作成する。

外部ファイルで読み込んでもいいし、とりあえずHTMLのSELECTタグよりは手前に記述する。

2.SELECTタグの「onchange(プルダウンが操作された場合に実行されるイベントです。)」に、実行したい関数名を書く。

3.「1.」の関数内で選択されているOPTIONタグのvalue値を取得し、hiddenのvalueに代入する。

パッと思いついたままに書いたのですが、たぶんこれで動くはずです。

エラーが出たらいろいろ調べてみてください。

僕は普段は違う形式で記述しますが、こちらのほうがわかりやすいと思うので・・・。

◎質問者からの返答

ありがとうございます。


4 ● Hidehisa
●100ポイント ベストアンサー

<FORM name="selectForm" action="../select.jsp" method="post">

<SELECT size=1 name="selectList" style='{width:200}' onchange="javascript:document.forms.selectForm.selectID.value = this.options[this.selectedIndex].value;">

<OPTION value=-1 selected>-選択-</option>

<OPTION value=1>選択肢1</OPTION>

<OPTION value=2>選択肢2</OPTION>

<OPTION value=3>選択肢3</OPTION>

<OPTION value=4>選択肢4</OPTION>

</SELECT>

<INPUT type="hidden" name="selectID" value="" />

<INPUT type="image" alt="入力" width=98 src="../select.gif" value="" border="0" />

</FORM>

selectとかinputとかにidを付けるほうがスマートかもしれませんが。

◎質問者からの返答

簡単な方法で実装できたました。

ありがとうございました。


5 ● Marine-Blue
●20ポイント

こんな感じでしょうか。

selectForm.selectID.value = selectForm.selectList.options[selectForm.selectList.selectedIndex].value;


selectForm.selectList.options[★].value →selectFormというフォームにあるselectListというプルダウンメニューの★番目のvalue値を取得する。

selectForm.selectList.selectedIndex → selectFormというフォームにあるselectListというプルダウンメニューの何番目が選択されているか。

selectForm.selectList.options[selectForm.selectList.selectedIndex].value → 選択中項目が何番目かを調べ、その○番目(選択中項目)のvalue値を調べる。

http://www.openspc2.org/JavaScript/ref/form/selIndex.htm


ところで、不都合がなければプルダウンメニューの選択項目のデータを直接JSPに送信してもいいのではないでしょうか…。

◎質問者からの返答

丁寧な説明をありがとうございます。

意味が理解できました。

関連質問


●質問をもっと探す●



0.人力検索はてなトップ
8.このページを友達に紹介
9.このページの先頭へ
対応機種一覧
お問い合わせ
ヘルプ/お知らせ
ログイン
無料ユーザー登録
はてなトップ