ie6,7下js动态加载图片不显示错误

yanxiaodi

墨衍会员 · AI 创作全网分发码龄19年

关注

原创最新推荐文章于 2024-01-24 16:02:44 发布 2.5k 阅读 AI 写同款· GEO 优化 ›

AI权益加码！Claude Code、Cursor等20+工具免费用！购周边限时加赠Coding Plan Lite，畅享主流AI工具！学习进阶更高效！阅读详情

做了一个商品详情页面，先加载几个小图片，然后点击显示大图，

html如下：

<a href="javascript:void(0);">
<img height="75px" width="75px" src='<%# Eval("PicSmallPath")%>' onclick="loadimg('<%# Eval("PicLargePath")%>','<%# Eval("PicMediumPath")%>')"
align="middle" />
</a>

用js写的，如下：

function loadimg(_big, _obj) { $("#midimg").attr("src", _obj); }

结果ie6、7都不正常。换了种写法：
$("#midimg").get(0).src = _obj;

还是不行，再换：
var img = document.getElementById("midimg");
img.src = _obj;

还是不行。
继续百度之，终于发现一篇文章：http://flyheaven.blog.163.com/blog/static/74011722009111124417164/
http://hi.baidu.com/smallchicken/blog/item/f039fb664e3c532eab184c9d.html

IE6,7只有在用<a onclick="switch_image()" href="javascript:void(0);"></a>这样
动态加载图片是才会出现这种情况，google到的一篇说明：

有几个吃饱了没事儿干的老外反复试验发现这个问题是ie6中一个底层机制的bug，之后的版本已经解决了。
据说<a href="javascript:void(0)">或者<a href=#">这样使用a标签的话并不能阻止a标签最后触发一个什么行为，
导致ie6会错误的认为页面刷新或者重定向了，并且中断了当前所有连接，这样新图片的加载就被aborted了。
当然这些吃饱了没事儿干的老外们也提出了各种匪夷所思复杂无比的解决方案。

最简单的方法有两个，一个是这样使用a标签<a href="switch_image(); return false;">，另外一个就是用div替换a标签来用。

实际上我发现不仅是IE6，IE7也同样有这个bug，还有，采用：<a href="switch_image(); return false;">并不能解决问题。

所以推荐用其他标签替换a标签，最后一怒之下把所有的a标签替换为span，从此就再也没出现这样的问题了。

终于搞定了，可恶的IE6.

收录于