在选择框中选择选项时的事件名称

Question

当我们在选择框中改变某些内容时，我知道事件名称为 change （HTML： onchange ），但我想知道当我选择（点击）特定选项时的事件名称。

例如：

<select>
    <option>Option 1</option>
</select>

当我点击“选项1”时，会发生什么事件？只有选择本身和所有选项上的“更改”事件，还是还有其他事件？谢谢。

- David Bélanger

---

在大多数浏览器中更改。 - mplungjan

Answer 1

默认情况下，在大多数浏览器中，当您更改 select 时会发生 change 事件，而当您选择 option 时会发生 click 事件。

$('select').on('change', function(event) {
  console.log(event.type);   // event.type is to get event name
});

- thecodeparadox

Answer 2

在SELECT上使用'change'事件，在OPTION上使用'click'事件。另外，在Opera浏览器中，如果你使用addEventListener()添加监听器，'input'事件也可能在SELECT上触发。

- Shadow2531

---

尽管所选答案展示了如何自行查找，这非常有用，但实际上，这才是正确的答案。 - Design by Adrian

Answer 3

event.type 返回事件的性质。请参考演示

$('select').bind('change', function(event) {
    alert("Event :"+ event.type);   
});

您可以在元素上使用 .on/.bind。

- Nishu Tayal

Answer 4

您可以将其放置在您感兴趣的选项的onclick事件中，如下所示：

<select id="MySelect">
    <option id="optionA" onclick="alert('You clicked A')">a</option>
    <option id="optionB">b</option>  
</select>

- JohnFx