解决IE8下动态生成链接onclick事件失效问题

作者:小圆点

时间:2026-10-28

浏览:240

本文针对博客园闪存分页在IE8浏览器中点击页码无法翻页的问题进行排查。发现通过setAttribute或jQuery的attr方法动态添加onclick事件在IE8中均失效。最终采用直接赋值函数并配合eval执行字符串的方式,成功解决了该兼容性问题。

文章目录

IE8动态添加onclick事件失效分析

博客园闪存分页功能由JavaScript动态生成,近期测试发现,在IE8浏览器环境中,点击页码无法触发翻页操作,该翻页逻辑依赖于当前页码元素的onclick事件。

最初的实现代码如下:

代码如下:

var a = document.createElement("a");
a.setAttribute("onclick", this.ClickFunctionName + "(" + pageIndex + ");Pager.SetCurrent(" + pageIndex + ");");

由于IE8浏览器对setAttribute方法的支持存在缺陷,导致此处通过setAttribute添加的onclick事件处理程序未能成功绑定。

随后尝试改用jQuery的attr方法进行设置:

代码如下:

$(a).attr("onclick", this.ClickFunctionName + "(" + pageIndex + ");Pager.SetCurrent(" + pageIndex + ");");

虽然此时onclick属性看似已添加,但在IE8中无论点击多少次,该事件处理程序均无法执行,而在Chrome与Firefox浏览器中此方式无异常。

兼容IE8的最终解决方案

最终通过以下代码解决了该兼容性问题:

代码如下:

var js = this.ClickFunctionName + "(" + pageIndex + ");Pager.SetCurrent(" + pageIndex + ");";
a.onclick = function() { eval(js); }

实用工具推荐

电子包浆

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

使用 ›
图片压缩

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

使用 ›
相关文章