在IE7浏览器中,通过JavaScript动态创建INPUT元素并设置type为checkbox时,若在将其添加到DOM树之前直接设置checked属性为true,会导致复选框无法正确显示选中状态。这是因为控件尚未初始化。解决方法是先通过appendChild将元素插入文档,再设置checked属性,即可确保在IE7及后续版本中正常显示勾选状态。
IE7中动态创建CheckBox设置checked属性不生效的解决方案
代码如下:
var chkbox = document.createElement("INPUT");
chkbox.type = "checkbox";
chkbox.checked=true;
lnk.parentNode.appendChild(chkbox); 上述代码在IE7浏览器环境下执行时,生成的复选框无法正确显示为选中状态。
出现该问题的原因在于,在调用appendChild将控件添加到页面之前,直接对其checked属性进行了赋值操作,此时控件尚未完成初始化。
基于此原因,调整代码执行顺序即可实现正确显示:
代码如下:
var chkbox = document.createElement("INPUT");
chkbox.type = "checkbox";
lnk.parentNode.appendChild(chkbox);
chkbox.checked=true;