将onclick事件添加到HTML选择选项中

Question

我在我的选择标签中添加了onclick事件，就像以下代码一样 -

<option onclick="alert('Hello')">Say Hello</option>

但是它没有起作用...

我该如何设置选项的 onclick 事件来触发？

- Shai

---

我们没有针对 option 的点击事件。请改为在 select 元素上使用 onchange 事件。注意不要改变原意，尽量通俗易懂。 - Arulraj

我无法发表评论，因为我的声望不足50。在我的情况下，我需要为选项元素添加onclick事件，因为我需要在iOS Safari上聚焦到下一个文本输入框，而这只能通过用户操作（例如用户单击）来实现。 - Kia Faraji

Answer 1

在onchange处理程序中尝试它：

function checkAlert(evt) {
  if (evt.target.value === "Say Hello") {
    alert('Hello');
  }
}

<select onchange="checkAlert(event)">
  <option>Test</option>
  <option>Say Hello</option>
</select>

- Blue

Answer 2

我更喜欢使用Id来添加事件监听器，以将您的代码与HTML分离，因此我会给您的选择标签添加一个ID，例如 "my-select"，然后通过其ID选择此标签并添加 onchange 事件监听器。 以下是代码：

<select id="my-select">
    <option value="1">Say Hello</option>
</select>
<script>
document.getElementById("my-select").addEventListener("change", printMsg);
function printMsg() {
    alert("Hello");
}
</script>

- mshouman

Answer 3

你应该在选择元素本身上使用onchange事件。

<select onchange="alert('hello')">
    <option value="0">Say Hello</option>
    <option value="1">Some other option</option>
</select>

希望这有所帮助，

- Eden Reich