onclick选项标签不适用于IE和Chrome

Question

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

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

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

例如:假设第一次用户选择"一个"下拉列表我会在处理完一些东西之后打开一个弹出窗口用户关闭弹出窗口,假设用户想要选择相同的"一个"下拉列表它不会触发任何事件.这可以使用onclick事件解决选项标签,但它不适用于IE和Chrome

这有什么工作吗？

Answer 1

onclickoption标签上的事件将在大多数版本的IE,Safari和Chrome 上失败:参考

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

<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中不起作用.因此,我在这里提出了另一个问题:为什么Firefox对Webkit和IE的反应不同于"select"标签上的"click"事件？

到目前为止,似乎使用<select>标签将无法在所有浏览器中一致地工作.但是,如果我们使用库来模拟选择菜单(例如jQuery UI选择菜单)或选择创建选择菜单而不是使用<select>标签,click则会触发事件<ul>或<li>标记,这在我测试的所有浏览器中都是一致的.

Answer 2

我还有一个建议，不是 100%，而是几乎：

<select onchange="valueChanged(this.value); this.selectedindex = -1">
    <option style="display: none"></option>
    <option value="1"> 1 </option>
    <option value="2"> 2 </option>
    <option value="3"> 3 </option>
    <option value="4"> 4 </option>
</select>

这样即使用户选择了相同的选项两次，事件也会被触发。问题是 IE 将显示空选项（它忽略 style 属性），但单击它不会触发事件，因为它始终以被选中的状态开始，因此选择它不会触发 onchange ...