[解決済み] JavaScriptでドロップダウンリストの選択値を取得する
2022-03-12 19:01:56
質問
JavaScriptを使用してドロップダウンリストの選択された値を取得するにはどうすればよいですか?
以下の方法を試しましたが、いずれも値の代わりに選択されたインデックスを返します。
var e = document.getElementById("ddlViewBy");
function show(){
var as = document.forms[0].ddlViewBy.value;
var strUser = e.options[e.selectedIndex].value;
console.log(as, strUser);
}
e.onchange=show;
show();
<form>
<select id="ddlViewBy">
<option value="1">test1</option>
<option value="2" selected="selected">test2</option>
<option value="3">test3</option>
</select>
</form>
解決方法は?
このようなselect要素がある場合。
<select id="ddlViewBy">
<option value="1">test1</option>
<option value="2" selected="selected">test2</option>
<option value="3">test3</option>
</select>
このコードを実行する
var e = document.getElementById("ddlViewBy");
var strUser = e.value;
を作成します。
strUser
である
2
. もし、実際に欲しいものが
test2
であれば、こうしてください。
var e = document.getElementById("ddlViewBy");
var strUser = e.options[e.selectedIndex].text;
この場合
strUser
である
test2
関連
-
Vueがechartsのtooltipにクリックイベントを追加するケーススタディ
-
[解決済み] JavaScript で配列に値が含まれているかどうかを確認するにはどうすればよいですか?
-
[解決済み] JavaScriptでタイムスタンプを取得する方法は?
-
[解決済み] JavaScriptで現在のURLを取得する?
-
[解決済み] JavaScriptでJSONをきれいに印刷する
-
[解決済み] JavaScriptで現在の日付を取得するには?
-
[解決済み] jQueryを使ってドロップダウンリスト(セレクトボックス)から選択されたテキストを取得する
-
[解決済み] セレクトボックスのプレースホルダーを作成するにはどうすればよいですか?
-
[解決済み] setTimeout(fn, 0)が役に立つことがあるのはなぜですか?
-
[解決済み] jQueryでドロップダウンリストの選択値を変更する
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
JSクロスドメインソリューション リアクト構成 リバースプロキシ
-
Vue+ElementUIによる大規模なフォームの処理例
-
Javascript Bootstrapのグリッドシステム、ナビゲーションバー、ローテーションの説明
-
vueはopenlayersを使用してスカイマップとガオードマップをロードする
-
Vueのクラススタイルの使い方の詳細
-
Vueの一般的な組み込みディレクティブの説明
-
[解決済み】Node.js getaddrinfo ENOTFOUND
-
[解決済み】React - TypeError: 未定義のプロパティ 'props' を読み取ることができない。
-
フロントエンド非同期(アシンク)ソリューション(全ソリューション)
-
OSSアップロードエラーを解決する: net::ERR_SSL_PROTOCOL_ERROR