Select selectedIndex 属性

什么是 selectedIndex 属性

selectedIndex 是 <select> 元素的一个属性，用于设置或获取下拉选项框中被选中选项的索引值。索引值从 0 开始，表示第一个选项，依次递增。

如何使用 selectedIndex 属性

要使用 selectedIndex 属性，首先需要获取到 <select> 元素的引用。可以通过 document.getElementById() 方法来获取到该元素的引用，然后就可以通过设置 selectedIndex 属性来控制默认选中的选项了。

// www.javascriptcn.com code example
<select id="mySelect">
  <option value="option1">Option 1</option>
  <option value="option2">Option 2</option>
  <option value="option3">Option 3</option>
</select>

<script>
  var selectElement = document.getElementById('mySelect');
  selectElement.selectedIndex = 1; // 默认选中第二个选项
</script>

在上面的示例中，我们首先获取了 id 为 mySelect 的 <select> 元素的引用，然后将其 selectedIndex 属性设置为 1，即默认选中第二个选项。

注意事项

• 设置 selectedIndex 属性时，需要保证索引值在合法范围内，即大于等于 0 且小于选项的数量。否则可能会导致错误。
• 如果希望清除下拉选项框的选中状态，可以将 selectedIndex 属性设置为 -1。

总结

通过 selectedIndex 属性，我们可以方便地控制下拉选项框中默认选中的选项。合理地使用该属性可以提升用户体验，使用户更加便捷地选择他们需要的选项。希望本文对你有所帮助！