获取多选下拉列表的 selectedIndex

Question

我有一个 HTML 选择下拉列表，其中multiple提供了：

<select multiple id="mySelect">
  <option>Apple</option>
  <option>Orange</option>
  <option>Pineapple</option>
  <option>Banana</option>
</select>

并分配一个单击处理程序，该处理程序返回当前单击的元素的索引：

document.getElementById("mySelect").onclick = function() {
  alert(this.selectedIndex);
}

当我仅选择其中一个元素时，效果很好。但我想返回当前选择的所有索引。

当我点击Apple, Orange and Banana返回时，就像[0,1,3]我想要的那样，但它不起作用。

工作示例：JSfiddle

Answer 1

该selectedOptions有一个浏览器 API ，但不支持 IE。

document.getElementById("mySelect").onclick = function() {
  console.log(Array.from(this.selectedOptions).map(option => option.index))
}

<select multiple id="mySelect">
  <option>Apple</option>
  <option>Orange</option>
  <option>Pineapple</option>
  <option>Banana</option>
</select>