【问题标题】:Internet Explorer 10 - jQuery click on select option doesn't workInternet Explorer 10 - jQuery 单击选择选项不起作用
【发布时间】:2026-01-17 15:25:01
【问题描述】:

我尝试将事件 jQuery 事件侦听器 click(function(){//doStuff}) 映射到 <option> 元素,但是在单击/聚焦时,IE 不执行我的函数。

在 FF 和 Chrome 中,它可以完美运行。在 IE10 中,点击选项不起作用;既不是 HTML 元素 onClick="doFunction()",也不是 on.('click',...) 事件。

这里是jsFiddle

<select id="someId" name="someName" size="10" multiple="yes">
<option value="ALL">--All--</option>
<option value="X1">X1</option>
<option value="X2">X2</option>
<option value="X3">X3</option>
<option value="X4">X4</option>
<option value="X5">X5</option>
<option value="X6">X6</option>
<option value="X7">X7</option>
<option value="X8">X8</option>
<option value="X9">X9</option>
</select>


$(document).ready(function () {
    $('#someId option[value="ALL"]').click(function () {
        $('select option').attr('selected', true);
        $('select option[value="ALL"]').eq(0).attr('selected', false);
    });
});

【问题讨论】:

  • 您不能将点击事件附加到&lt;option&gt; 标记。

标签: javascript jquery internet-explorer internet-explorer-10


【解决方案1】:

维利亚姆,恐怕我有个坏消息。 IE10 不会真正为选项触发“单击”事件,而是仅为“选择”触发它。所以你可以做的是把“点击”事件处理程序放在选择上,跟踪选择的值并采取行动。

Demo

$('#someId').click(function () {
    if ($("#someId option:selected").eq(0).val() === 'ALL') {
        $('select option').prop('selected', true);
        $('select option[value="ALL"]').eq(0).prop('selected', false);
    }
});

【讨论】:

  • 完美运行,我应该尝试将事件映射到父级,但我在错误的位置玩耍。
  • 当点击选择元素上的空白处时,这可能会导致意外行为,因为点击被识别但值保持不变。可以与change 事件结合使用。
最近更新 更多