JSでプルダウンの選択値をとりたくて、以下のように書きました。
var select = document.getElementById('test');
var options = document.getElementById('test').options;
var value = options.item(select.selectedindex).value;
都合により、getElementByIdではなくてgetElementsByNameで
同様のことをしたいのですが、単純にgetElementsByNameに
置換しただけでは動きませんでした。
(Nameは一意になるよう作っています)
確か配列でデータが来るとかいう話を聞いた覚えがあるので、
どこかにインデクサを指定すればいけるでしょうか?
申し訳ないですが、ご教授ください。
No.3ベストアンサー
- 回答日時:
日本語は単数/複数の使い分けが
いい加減なのですが、英語は厳密で、
動詞などが活用変化しますよね。
英語起源のプログラム言語も同様に
単数/複数の使い分けが重要です。
getElementById:
単数形なので、単一オブジェクトが
返ります。
getElementsByName:
複数形なので、オブジェクトの集合
つまり、コレクションが返ります。
特定するにはインデックスやIDで
一意にする必要があります。
ついでに言うと、valueは単数ですが、
optionsは複数なので、selectedIndexで
インデックスを指定しないと、選択した
値が取れません。
同じようなものにformとforms、
windowとwindowsなどがあります。
単複によるオブジェクト/コレクションの
違いはJavaScriptだけでなく、他の
多くの言語でも見られることです。
No.4
- 回答日時:
HTMLDocument#getElementsByName は DOM L2 HTML 規定および HTML Standard (HTML5) 規定では name 属性値を元に NodeList を返す仕様です。
http://www2u.biglobe.ne.jp/~oz-07ams/prog/dom-re …
http://www.whatwg.org/specs/web-apps/current-wor …
対して、IE (IE9 では修正されているかもしれません) は id, name 属性値を元に HTMLElementCollection を返す仕様になっています。
http://msdn.microsoft.com/en-us/library/windows/ …
NodeList と HTMLElementCollection の違いは小さなものですが、id 属性値を含んで返す IE の仕様には注意する必要があります。
> Nameは一意になるよう作っています
name の中で一意にするのではなく、id, name の中で一意にしなければなりません。
id と name で重複した名前を使用しないほうがいいでしょう。
http://www2u.biglobe.ne.jp/~oz-07ams/prog/dom-re …
http://d.hatena.ne.jp/sandai/20100823/p1#002
以上のマークアップ規約を守れば、次のように書けます。
var select = document.getElementsByName('test')[0], // id="test" が存在せず、name="test" が一つだけ存在するなら、NodeList の初めの要素が目的の要素となる
options = select.options,
value = options.item(select.selectedindex).value;
管理が面倒になりがちなので、私としては getElementsByName ではなく、HTMLFormElement#elements による参照をお勧めします。
document.getElementsByTagName('form')[0].elements.namedItem('test');
http://www2u.biglobe.ne.jp/~oz-07ams/prog/dom-re …
No.2
- 回答日時:
nameの対象が必ず存在して、一意かつselectであることがわかっているのなら
var value = document.getElementsByName('test')[0].value;
とか。
No.1
- 回答日時:
たとえば、
var options = document.getElementsByName('test').options;
の場合、
option[0]
になります
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- JavaScript 以前の質問だと、どの条件でも配列が表示されてしまいます。 1 2022/07/09 11:40
- JavaScript セレクトボックスで配列を呼び出したい。 1 2022/07/08 20:14
- JavaScript javascript作成してます。ラジオボタンで判定するコードを書いてます。 1 2023/07/18 11:03
- JavaScript console.logがどうしても2つ機能しないのでアドバイスをくださいお願いします 2 2022/07/07 22:13
- JavaScript gasについて 1 2022/05/31 21:51
- JavaScript 電車の運賃を出すプログラムを作っています。 2 2022/06/22 09:36
- JavaScript 【jquery】EasyUIのSubGridにMySQLのテーブルデータを表示&編集にしたい 5 2022/05/02 13:10
- JavaScript JavascriptからSQLへ繋ぎ方が分からない 3 2022/07/07 00:27
- JavaScript 1日1回引けるJavaScriptおみくじについて 1 2022/12/12 22:28
- JavaScript コードレビューをお願いします。 1 2022/07/16 05:38
関連するカテゴリからQ&Aを探す
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
プルダウン 項目が多いので先頭...
-
onchange等のイベントハンドラ...
-
Selectの中身をfor文で入れる
-
セレクトの値を取得できない
-
onFocusOutが複数回呼ばれる!
-
セレクトを全て選択されていな...
-
CSVファイルを読みこみ、プルダ...
-
プルダウンで現在の年月日を取...
-
javascriptでプルダウンメニュ...
-
プルダウン Or コンボボックス...
-
JavaScript セレクトの中でfor...
-
Selectボックスの幅を自動で広...
-
window.openで新しいタブが開か...
-
javascriptでの2つのプルダウン...
-
JQuery selectが反映されない
-
html selectの内容を初期値に戻す
-
<textarea>にプルダウンを表示...
-
現在時刻を取得してフォームのs...
-
return trueとreturn falseの用...
-
javascriptでセレクトボックス...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
プルダウン 項目が多いので先頭...
-
Selectの中身をfor文で入れる
-
Selectボックスの幅を自動で広...
-
CSVファイルを読みこみ、プルダ...
-
セレクトを全て選択されていな...
-
jQuery セレクトボックスで選択...
-
UWSCのIE操作でプルダウンを選...
-
html selectの内容を初期値に戻す
-
現在時刻を取得してフォームのs...
-
javascriptでの2つのプルダウン...
-
selectタグに直接onChangeを書...
-
テーブルにおける行(セルにプル...
-
【javascript・PHP】プルダウン...
-
セレクトメニューで選択された...
-
ブラウザの戻るボタンを押した...
-
JQuery selectが反映されない
-
<textarea>にプルダウンを表示...
-
プルダウンで現在の年月日を取...
-
リストボックスの項目の順番を...
-
親ウィンドウのリスト値変更
おすすめ情報