1. ホーム
  2. javascript

[解決済み] 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