[IE8&IE7 onchange事件仅在重复选择后才触发

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了[IE8&IE7 onchange事件仅在重复选择后才触发相关的知识,希望对你有一定的参考价值。

我有一组带有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/

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

如此table on quirks mode所示,在IE7和IE8中,单选按钮和复选框上的更改事件有很多错误。

您可以像这样监听click事件:

<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/

通常,使用JQueryYUI之类的javascript库可以使您的生活更轻松,尽管从我的测试来看,它们不能在IE的较早版本中解决此错误。

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

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

另一答案
另一种选择是像已经拥有一个onchange事件,并添加一个onclick事件以从单选按钮中删除焦点:

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

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

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

以上是关于[IE8&IE7 onchange事件仅在重复选择后才触发的主要内容,如果未能解决你的问题,请参考以下文章

ie7ie8兼容addEventListener和removeEventListener,解决this指向和detachEvent解除绑定事件问题

IE7、IE8中的子选择器问题

IE8 Browser Bootstrap 仅在响应模式下工作 [重复]

为啥以下创建 DOM 元素的方式不适用于 IE7 和 IE8 中的 jQuery?

IE7 仅在来自生产服务器的页面上忽略 CSS 属性选择器

nth-child 在 IE7/IE8 中不起作用