HTMLSelectElement: selectedIndex property
The HTMLSelectElement.selectedIndex
property is a
long
that reflects the index of the first or last selected
<option>
element, depending on the value of multiple
. The
value -1
indicates that no element is selected.
Value
A number.
Examples
HTML
html
<p id="p">selectedIndex: 0</p>
<select id="select">
<option selected>Option A</option>
<option>Option B</option>
<option>Option C</option>
<option>Option D</option>
<option>Option E</option>
</select>
JavaScript
js
const selectElem = document.getElementById("select");
const pElem = document.getElementById("p");
// When a new <option> is selected
selectElem.addEventListener("change", () => {
const index = selectElem.selectedIndex;
// Add that data to the <p>
pElem.textContent = `selectedIndex: ${index}`;
});
Specifications
Specification |
---|
HTML Standard # dom-select-selectedindex-dev |
Browser compatibility
BCD tables only load in the browser