IE8 & IE7 onchange 事件只有在重复选择后才会触发答案

【问题标题】：IE8 & IE7 onchange event is triggered only after repeated selectionIE8 & IE7 onchange 事件只有在重复选择后才会触发
【发布时间】：2012-06-19 13:23:27
【问题描述】：

我有一组带有 onchange 处理程序的收音机：

<input type="radio" name="Q12" value="radio" id="Q12_0"  onchange="nextPnl('Q12');">
<br/>
<input type="radio" name="Q12" value="radio" id="Q12_1"  onchange="nextPnl('Q12');">
         

function nextPnl(did)
{
document.write(did);

}

问题是在IE8&IE7中，onchange事件只有在反复选择后才会触发。

请在 IE 的开发者工具 [浏览器模式] IE8 中查看此演示： http://jsfiddle.net/3zwur/2/

【问题讨论】：

可以在this article找到IE7/IE8 onchange事件bug的通用解决方案。

标签： javascript html radio-button internet-explorer-8 dom-events

【解决方案1】：

另一种解决方案是通过 jQuery 将 onchange 事件放在封闭表单上。

$('#form').on('change', function() {
    $(this).submit();
});

【讨论】：

【解决方案2】：

另一种选择是像您一样拥有一个 onchange 事件，并添加一个从单选按钮移除焦点的 onclick 事件：

<input type="radio" name="Q12" value="radio" id="Q12_0" onclick="this.blur()" onchange="nextPnl('Q12');">

【讨论】：

【解决方案3】：

这是由于 IE7 和 IE8 的更改事件的错误。您应该改为收听click 事件。

如table on quirks mode 所示，单选按钮和复选框上的更改事件在 IE7 和 IE8 中存在很大缺陷。

你可以像这样监听点击事件：

<input type="radio" name="Q12" value="radio" id="Q12_0"  onclick="nextPnl('Q12');">
<br>
<input type="radio" name="Q12" value="radio" id="Q12_1"   onclick="nextPnl('Q12');">

还有一个你的小提琴叉：http://jsfiddle.net/T7VYL/

通常，使用 JQuery 和 YUI 等 javascript 库可以让您的生活更轻松，尽管根据我的测试，它们并没有修复旧版本 IE 中的这个错误。

如果您仍想收听更改事件，可以部署此修复程序：http://www.ridgesolutions.ie/index.php/2011/03/02/ie8-chage-jquery-event-not-firing/。基本上它会监听 click 事件，然后让元素触发 change 事件。

正如提问者的小提琴所示：http://jsfiddle.net/3zwur/3

【讨论】：

我刚刚测试了 JQuery 和 YUI3，不幸的是，他们没有修复旧版本 IE 中的这个错误。您的解决方案是监听 click 事件，或者像这样触发 change 事件：ridgesolutions.ie/index.php/2011/03/02/…
这对我来说过早地触发了——在文件输入对话框出现之前注册了点击。我的解决方案是在单击后的setTimeout 0 毫秒后执行更改功能，滥用异步性以允许在此发生之前清除堆栈（以及解决文件输入操作）：onchange="setTimeout(function deferNextPnl(){nextPnl('Q12')},0)"。
"Change" 是复选框的首选事件，我只是花了两个令人沮丧的小时试图让它在现代浏览器和 IE8 中工作，但在 IE8 中没有工作，但是当我阅读并更改时“onclick” IE8 的事件起作用了。