Get the Selected Value of Select Box with JavaScript

01/15/2022
Contents
In this article, you will learn how to get the selected value of select box with JavaScript.
Get the select box
The HTML used this time is as follows.
HTML
<form>
<select name="selectbox">
<option value="">--Select--</option>
<option value="javascript">JavaScript</option>
<option value="jquery">jQuery</option>
<option value="html">HTML</option>
<option value="css">CSS</option>
</select>
</form>
Use the forms property to get only the select box from the form.
JavaScript
let form = document.forms[0];
let selectbox = form.selectbox;
console.log(selectbox);
//result
//<select name="selectbox">
// <option value="">--Select--</option>
// <option value="javascript">JavaScript</option>
// <option value="jquery">jQuery</option>
// <option value="html">HTML</option>
// <option value="css">CSS</option>
//</select>
Get the selected value of select box
This time get the value when the selection of the select box is changed.
JavaScript
let form = document.forms[0];
let selectbox = form.selectbox;
selectbox.addEventListener('change', ()=> {
console.log(selectbox.value);
}, false);