How to get selected value/text from select on change with JavaScript?

Sometimes, we want to get selected value/text from select on change with JavaScript.

In this article, we’ll look at how to get selected value/text from select on change with JavaScript.

How to get selected value/text from select on change with JavaScript?

To get selected value/text from select on change with JavaScript, we can use the select element’s value property.

For instance, we write

<select id="select_id">
  <option value="0">-Select-</option>
  <option value="1">Communication</option>
</select>

to add a select drop down.

Then we write

const d = document.getElementById("select_id");
d.onchange = () => {
  console.log(d.value);
};

to select the select drop down with getElementById.

And then we set d.onchange to a function that runs when the drop down selection changes.

In it, we get the value attribute value of the selected option element with d.value.

Conclusion

To get selected value/text from select on change with JavaScript, we can use the select element’s value property.