html - onclick on 选项标签不适用于 IE 和 chrome

Question

我在 select 框的选项标签中使用 onclick 事件

<select>
    <option onclick="check()">one</option>
    <option onclick="check()">two</option>
    <option onclick="check()">three</option>
</select>`

onclick 事件在 IE 和 Chrome 上不工作，但在 firefox 中工作正常，在这里我不想在选择标签上使用 onchange 事件 bcz 如果用户再次选择相同的选项它不会触发事件

Eg:say first time user selects "one" dropdown I will open a popup after processing some stuff user closes the popup,suppose if user wants to select same "one" dropdown it will not trigger any event.this can be solved using onclick event on option tag but its not working on IE and chrome

有解决办法吗？

Answer 1

onclick事件 option标记将在大多数版本的 IE、Safari 和 Chrome 上失败:reference

如果您想在用户选择时触发事件，为什么不简单地使用:

<select onclick="check()">
<option>one</option>
<option>two</option>
<option>three</option>

如果您想对用户选择的特定选项执行某些操作:

<select onclick="if (typeof(this.selectedIndex) != 'undefined') check(this.selectedIndex)">
<option>one</option>
<option>two</option>
<option>three</option>

这样你就可以保证调用check()当且仅当一个选项被选中时。

编辑:正如@user422543 在评论中指出的那样，此解决方案在 Firefox 中不起作用。因此我在这里问了另一个问题:Why does Firefox react differently from Webkit and IE to "click" event on "select" tag?

到目前为止，它似乎使用 <select>标签不会在所有浏览器中始终如一地工作。但是，如果我们使用 jQuery UI select menu 等库模拟选择菜单或 Chosen创建一个选择菜单而不是使用 <select>标签，click事件将在 <ul> 上触发或 <li>标签在我测试的所有浏览器中都是一致的。