react如何获取option的下标和值_select选中获取索引三种写法

获取option的下标和值有多种方法，以下是其中一种使用JavaScript的方法：

在HTML中，我们可以使用`select`和`option`标签创建下拉列表，如下所示：

<select id="mySelect">
  <option value="apple">Apple</option>
  <option value="orange">Orange</option>
  <option value="banana">Banana</option>
</select>

我们可以使用JavaScript来获取选中的option的下标和值：

var selectElement = document.getElementById("mySelect");
var selectedOptionIndex = selectElement.selectedIndex;
var selectedOptionValue = selectElement.options[selectedOptionIndex].value;

其中，`selectedIndex`属性可以获取选中的option的下标，`options`属性可以获取所有的option元素，我们可以使用`selectedIndex`来获取选中的option元素，然后再获取其`value`属性来获取选中的值。

另外，我们也可以使用jQuery来获取选中的option的下标和值：

var selectedOptionIndex = $("#mySelect").prop('selectedIndex');
var selectedOptionValue = $("#mySelect").val();

其中，`prop`方法可以获取`selectedIndex`属性，`val`方法可以获取选中的option的值。

还有一种方法是在`select`标签上添加`onchange`事件，当选中的option改变时触发该事件，然后在事件处理函数中获取选中的option的下标和值：

<select id="mySelect" onchange="handleSelectChange()">
  <option value="apple">Apple</option>
  <option value="orange">Orange</option>
  <option value="banana">Banana</option>
</select>

function handleSelectChange() {
  var selectElement = document.getElementById("mySelect");
  var selectedOptionIndex = selectElement.selectedIndex;
  var selectedOptionValue = selectElement.options[selectedOptionIndex].value;
}

这种方法可以在选中的option改变时及时获取其下标和值。