zoukankan      html  css  js  c++  java
  • ie6,7下js动态加载图片不显示错误

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

    html如下:

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

    用js写的,如下:

    结果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.

  • 相关阅读:
    Laravel 进阶笔记 3
    Laravel 进阶笔记 5
    Laravel 进阶笔记 4
    Laravel 进阶笔记 2
    Laravel 进阶笔记
    Laravel笔记.
    Think PHP-- 笔记3
    git删除远程分支
    Think PHP 3.2.3 伪静态的方法
    解决iframe IE8透明不兼容
  • 原文地址:https://www.cnblogs.com/yanxiaodi/p/2296459.html
Copyright © 2011-2022 走看看