Question

我被迫使用IE8（8.0.7601.17514），我有这个简单的页面：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd" >
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
</head>
<body>
<form action=".">
    <input type="radio" name="rad" value="1" onchange="alert(1);"/>
    <input type="radio" name="rad" value="0" onchange="alert(0);" checked="checked"/>
</form>
<a href="http://google.com">some dummy link</a>
</body>
</html>

我的期望是，当选择第二个单选按钮时，单击第一个单选按钮将立即发出警报。这在FF中工作正常。

实际发生的是当我点击第一个收音机时，没有任何反应。然后，当元素模糊时（例如，我点击其他地方，另一个无线电，页面中的某些链接等），然后提出警报。

有解决方法吗？

编辑：

显然这种行为完全符合W3C spec

更改

当控件失去输入焦点并且自获得焦点后其值已被修改时，会发生更改事件。此事件对INPUT，SELECT和TEXTAREA有效。元件。

（感谢@ mu-is-too-short）。

解决方法是添加onclick blur + focus：

function radioClick()
{
 this.blur();  
 this.focus();  
}


<input type="radio" name="rad" value="1" onclick="radioClick" onchange="alert(1);"/>

Answer 1

在Internet Explorer（最多至少IE8）中，单击单选按钮或复选框以更改其值实际上不会触发onChange事件，直到输入失去焦点。

因此你需要以某种方式自己触发模糊事件..一个建议就是有一个功能：如下：

function radioClick()
{
 this.blur();  
 this.focus();  
}


<input type="radio" name="rad" value="1" onclick="radioClick" onchange="alert(1);"/>

现在应该触发onchange事件，但正如您所看到的那样，它是冗余代码，因此您最好只使用onclick事件处理程序。

更好的解决方案是使用像jquery这样的现代javascript库来处理所有这些怪癖。

Answer 2

从技术上讲，IE实际上是正确的。来自fine specification：

更改

当控件失去输入焦点并且自获得焦点后其值已被修改时，会发生更改事件。此事件对INPUT，SELECT和TEXTAREA有效。元件。

因此，为了触发更改事件，规范指出元素必须失去焦点（即需要模糊）。通常的kludge是使用点击处理程序或强制其他人建议的模糊。

Answer 3

使用onclick，但是在更改值（或checked属性）之前调用事件处理程序 msdn

在IE8中，radiobutton上的onchange无法正常工作

3 个答案: