プロが教える店舗&オフィスのセキュリティ対策術

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一つなら出来たのですが
複数になると追加をどうするのかやり方がわからなくて・・・

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

A 回答 (5件)

こういうことではなく?



<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>

この回答への補足

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


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

補足日時:2010/08/27 16:27
    • good
    • 0
この回答へのお礼

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

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

お礼日時:2010/09/02 17:38

No.1です。


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

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>

この回答への補足

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


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

補足日時:2010/08/27 16:27
    • good
    • 0

考えるべき要素が複数あります。


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

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

この回答への補足

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


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

補足日時:2010/08/27 16:27
    • good
    • 0

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



<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属性を使えばいいです。

この回答への補足

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


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

補足日時:2010/08/27 16:26
    • good
    • 0

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!