--- title: HTMLSelectElement.selectedIndex slug: Web/API/HTMLSelectElement/selectedIndex tags: - HTML формы - HTMLSelectElement translation_of: Web/API/HTMLSelectElement/selectedIndex --- <div>{{APIRef("HTML DOM")}}</div> <p><code><strong>HTMLSelectElement.selectedIndex </strong></code>показывает порядковый номер первого выбранного элемента <code>{{HTMLElement("option")}}</code>. Значение -1 означает, что ни один из элементов не выбран.</p> <h2 id="Синтаксис">Синтаксис</h2> <pre class="syntaxbox">var <var>index</var> = <var>selectElem</var>.selectedIndex; <em>selectElem<code>.selectedIndex = </code>index;</em> </pre> <h2 id="Пример">Пример</h2> <h3 id="HTML">HTML</h3> <pre class="brush: html"><p id="p">Индекс выбранного элемента: 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> </pre> <h3 id="JavaScript">JavaScript</h3> <pre class="brush: js; highlight[6]">var selectElem = document.getElementById('select') var pElem = document.getElementById('p') // Когда выбран новый элемент <option> selectElem.addEventListener('change', function() { var index = selectElem.selectedIndex; // Добавить данные в <p> pElem.innerHTML = 'selectedIndex: ' + index; })</pre> <p>{{EmbedLiveSample("Пример", "200px", "80px")}}</p> <h2 id="Спецификации">Спецификации</h2> {{Specifications}} <h2 id="Совместимость_с_браузерами">Совместимость с браузерами</h2> <p>{{Compat}}</p>