IE7中动态创建CheckBox设置checked属性不生效的解决方案

作者:像素猫

时间:2026-10-24

浏览:380

在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;

实用工具推荐

电子包浆

绿化、压缩、噪点和虚拟水印,自由调节做旧程度。

使用 ›
图片压缩

选择画质和输出格式,预览压缩前后的大小。

使用 ›
相关文章