select要素のvalueを配列で取得したいです

解決済

質問者：tekkenman7
質問日時：2011/12/16 12:05
回答数：3件

select要素のvalueを配列で取得したく、下記のサンプルを動かそうと試みました。

<html>
<head></head>
<body>
<form>

</form>
<input type="button" value="はい" onclick="test(this.form)">

<script type="text/javascript">
function test ( form ) {
var values = new Array();
for ( var i=0; i < 20; i ++ ) {
var elm = form.elements['c'+i];
values[i] = elm.options[elm.selectedIndex].value;
}
}
</script>
</body>
</html>

このようなサンプルを動かそうとしたのですが、
var elm = form.elements['c'+i];のところの['c'+i]が正しくないようで
「elm is underfind」というエラーが出てしまいます

<script>
function myForm (form) {
var values = new Array();
for ( var i=0; i<20; i++ ) {
var elm = form.elements[i];
values[i] = elm.options[elm.selectedIndex].value;
document.write(values[i] + "<br />");
}
}
</script>
インデックス名を'c'+iからiにすると取得できるのですが、
ブラウザが読み込みをやめない状態になってしまいます。
select要素のnameはc1から始まりc20と何も換えていません。
何が間違っているのでしょうか。

通報する

この質問への回答は締め切られました。

質問の本文を隠す

回答 (3件)

ベストアンサー優先
最新から表示
回答順に表示

No.2ベストアンサー

回答者： yambejp
回答日時：2011/12/16 13:31

具体的にはこんなかんじ

この回答への補足

すみません、訂正です。
forの中に移動してalert(values[i]);とdocument.write(values[i]);でした。

補足日時：2011/12/16 15:51

通報する

- 0
- 件

通報する

この回答へのお礼

最後のalert(values);ですが、alert(values[i]);でも大丈夫ですが、
document.write(values[i]);にするとその症状がでてしまうようです。
不思議ですね。有難うございました。

通報する

お礼日時：2011/12/16 15:48

No.3

回答者： yambejp
回答日時：2011/12/16 16:34

document.writeはページの書き換えなのでこの場合は使ってはいけません。

てっとりばやくやるなら任意の場所のIDを指定してinnerHTMLを
書き変えてやることです。

<script>
function test(f) {
var values = new Array();
document.getElementById("hoge").innerHTML="";
for ( var i=0; i < 3; i ++ ) {
var elm =f.elements['c'+(i+1)];
values[i] = elm.options[elm.selectedIndex].value;
document.getElementById("hoge").innerHTML+=values[i]+" ";
}
}
</script>
<form>
<select name="c1">
<option value=""></option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
</select>
<select name="c2">
<option value=""></option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
</select>
<select name="c3">
<option value=""></option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
</select>
<input type="button" value="はい" onclick="test(this.form)">
</form>
<div id="hoge"></div>

- 0
- 件

通報する

この回答へのお礼

そうだったのですか。有難うございます。
参考サイト
http://d.hatena.ne.jp/atomer/20110108/1294502064

通報する

お礼日時：2011/12/16 20:00

No.1

回答者： yambejp
回答日時：2011/12/16 12:39

いくつか問題があります。

(1)formの外にボタンがある
＞</form>
＞<input type="button" value="はい" onclick="test(this.form)">

これは逆
<input type="button" value="はい" onclick="test(this.form)">
</form>

(2)セレクトの始まる番号とiがあっていない
＞for ( var i=0; i < 20; i ++ ) {
iが0から始まっているなら

＞var elm = form.elements['c'+i];
var elm = form.elements['c'+(i+1)];
にしておかないと・・・