javascriptについての質問です。複数の一つのselect等で選

質問

javascriptについての質問です。複数の一つのselect等で選択した文字の値をinputに表示したいのですが

<FORM>
<SELECT NAME="select1">
<OPTION VALUE=""></OPTION>
<OPTION VALUE="　a">a</OPTION>
<OPTION VALUE="　b">b</OPTION>
<OPTION VALUE="　c"c</OPTION>
</SELECT>

<SELECT NAME="select2">
<OPTION VALUE=""></OPTION>
<OPTION VALUE="　壱">壱</OPTION>
<OPTION VALUE="　弐">弐</OPTION>
<OPTION VALUE="　参">参</OPTION>
</SELECT>

<input TYPE="text" NAME="text1" VALUE="">
</FORM>

とこの様なフォームがあるとしまして
各SELECT で選択した各文字を
<input TYPE="text" NAME="text1" VALUE="">に追加したいんです。

SELECT一つなら出来たのですが
複数になると追加をどうするのかやり方がわからなくて・・・

一つのセレクトは一つしか選択できなくなればなお良いのですが・・・
どなたがご教授願えないでしょうか?

回答No.2

yambejp · ベストアンサー

こういうことではなく？

<script>
function changeFunc(f){
f.elements["text1"].value=f.elements["select1"].value+f.elements["select2"].value;
}
</script>

<FORM>
<SELECT NAME="select1" onchange="changeFunc(this.form)">
<OPTION VALUE=""></OPTION>
<OPTION VALUE="　a">a</OPTION>
<OPTION VALUE="　b">b</OPTION>
<OPTION VALUE="　c">c</OPTION>
</SELECT>

<SELECT NAME="select2" onchange="changeFunc(this.form)">
<OPTION VALUE=""></OPTION>
<OPTION VALUE="　壱">壱</OPTION>
<OPTION VALUE="　弐">弐</OPTION>
<OPTION VALUE="　参">参</OPTION>
</SELECT>

<input TYPE="text" NAME="text1" VALUE="">
</FORM>

お礼

素早い回答ありがとうございました。

確認したブラウザーの中一番動作したのでベストアンサーにさせていただきます。
ただIEの5.6.7で動かない様なので色々調べてみています。
ありがとうございました。

補足

誤って編集中に質問してしまいまして
編集できないようだったので困ったと思いながらちょっと放置してたら
まさか回答をいただけるとは思ってもいませんでした。
ありがとうございます!!

早速試してみてみなさんにお礼をしたいと思います。

回答No.5

yamada_g

No.1です。
なんかひどい回答ですね。変数に保持する必要がどこにあるんだ・・・
頭わるすぎてお恥ずかしい

回答No.4

yyr446

No.3様のおっしゃるとおりです。
さらに言えば、先にテキストボックスに入力した文字は
無視していいのか、あるいは前に挿入するのか、とか...

タイミングがよくわかりません。SELECTが選択される度に
書き換えるのも、出来なくはないですが、むしろフォーム
がサブミットされるタイミングで、連結しなおした方が
簡単だと思います。(目的がちがってたらあれですけど..)

<FORM onsubmit="add_sel_value(this)">
<SELECT NAME="select1">
<OPTION VALUE=""></OPTION>
<OPTION VALUE="　a">a</OPTION>
<OPTION VALUE="　b">b</OPTION>
<OPTION VALUE="　c"c</OPTION>
</SELECT>
<SELECT NAME="select2">
<OPTION VALUE=""></OPTION>
<OPTION VALUE="　壱">壱</OPTION>
<OPTION VALUE="　弐">弐</OPTION>
<OPTION VALUE="　参">参</OPTION>
</SELECT>
<input TYPE="text" NAME="text1" VALUE="">
</FORM>
<script type="text/javascript">
function add_sel_value(f){
f.text1.value=f.select1.value + f.select2.value+ f.text1.value;
return true;
}
</script>

補足

誤って編集中に質問してしまいまして
編集できないようだったので困ったと思いながらちょっと放置してたら
まさか回答をいただけるとは思ってもいませんでした。
ありがとうございます!!

早速試してみてみなさんにお礼をしたいと思います。

回答No.3

nda23

考えるべき要素が複数あります。
(1)文字列の結合
　これは＋を使います。"A"+"B"→"AB"
(2)タイミング
　何時、追加するのでしょうか？
　選択を変更した時？何かボタンをクリックした時？
(3)結合の方法
　select1が前、select2が後になるようにする？
　間に何か区切り文字は入るのか？

これが分からないと答えようがありません。

補足

誤って編集中に質問してしまいまして
編集できないようだったので困ったと思いながらちょっと放置してたら
まさか回答をいただけるとは思ってもいませんでした。
ありがとうございます!!

早速試してみてみなさんにお礼をしたいと思います。

回答No.1

yamada_g

簡易的なものですが・・・

<script type="text/javascript">
var value1 = '';
var value2 = '';
function setText(obj) {
var selectValue = obj.value;
if (obj.name === 'select1') {
value1 = selectValue;
} else if (obj.name === 'select2') {
value2 = selectValue;
}
document.forms[0].text1.value = value1 + value2;
}
</script>

<FORM>
<SELECT NAME="select1" onchange="setText(this)">
中略
</SELECT>

<SELECT NAME="select2" onchange="setText(this)">
中略
</SELECT>

<input TYPE="text" NAME="text1" VALUE="">
</FORM>

とか。

>一つのセレクトは一つしか選択できなくなればなお良いのですが・・・
の意味がちょっと分からなかったのですが。
1回選択したらもう変えられないようにするということでしょうか？
もしそうであれば、disabled属性を使えばいいです。

補足

誤って編集中に質問してしまいまして
編集できないようだったので困ったと思いながらちょっと放置してたら
まさか回答をいただけるとは思ってもいませんでした。
ありがとうございます!!

早速試してみてみなさんにお礼をしたいと思います。