IE 6/7 动态创建的单选框无法被选择
在IE 6/7上面，动态创建的单选框是无法被用户来选择的。这是一个已知的bug，并且在IE 8中被修正了。 已经有不少的资料在讨论这个问题了。对于这个问题，需要注意的是，如果要设置单选框的被选择状态（通过checked = true），需要在单选框已经被加入到DOM结构中之后来进行。我也写了一个简单的页面来测试并修正这个问题。基本的思路是通过onclick事件来动态选择。基本的代码如下：
<!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><title>IE 7 radio</title><script type="text/javascript">(function() { function byId(id) { return document.getElementById(id); } var data = [["label1", "value1"], ["label2", "value2"], ["label3", "value3"]]; var selectedRadio = null; function buildRadios() { var root = byId("test"); for (var i = 0; i <data.length; i++) { var label = document.createElement("label"); label.innerHTML = data; var radio = document.createElement("input"); radio.type = "radio"; radio.name = "test_radio"; radio.value = data; root.appendChild(label); root.appendChild(radio); if (i == 0) { radio.checked = true; selectedRadio = radio; } radio.onclick = function() { this.checked = true; if (selectedRadio != this) { selectedRadio.checked = false; selectedRadio = this; } }; } } window.onload = function() { buildRadios(); };})();</script></head><body><div id="test"></div></body></html>
页:
[1]