zoukankan      html  css  js  c++  java
  • IE6下jquery js将图片写入html图片不显示的问题

    今天突然发现ie6浏览器动态写入图片时,图片路径是正确的,但就是不显示图片.

    图片html已经插入到页面中,但是图片没有显示,IE7,火狐等浏览器都正常,要右键-“显示图片”,图片才显示,很奇怪的。

    code如下:

     function insertImg(o,id){
        var imageUrl= PIC_PATH;  //图片前缀

      if (id < 0) {
              return false;
          }
          $("#banks").css('display','none');
          $("#imgBox").html('<img src="'+imageUrl+'/images/pic/'+id+'.gif" alt="'+o.title+'" />');

    }

    htm如下:

    ul  id="imgLIst" class="img-list clear">
      <li><a href="javascript:;" onclick="insertImg(this, 1);" title="第一张图"><img src="http://www.xxxx.com/images/pic/1.gif" alt="第一张图"></a></li>
      <li><a href="javascript:;" onclick="insertImg(this, 2);" title="第二张图"><img src="http://www.xxxx.com/images/banks/2.gif" alt="第二张图"></a></li>

    </ul>

    百度了下发现

    这是IE6 一个底层机制的bug,是<a href="javascript:void(0)">或者<a href=#">这样使用a标签的话并不能阻止a标签最后触发一个什么行为,导致ie6会错误的认为页面刷新或者重定向了,并且中断了当前所有连 接,这样新图片的加载就被阻止了。

    一看自己的,确实使用a标签触发事件的:<a href="javascript:void(null);" class="btn" id="insert_pic">插入图片</a>

    将a标签改为其他标签,我就改成了属性相近的span标签,结果就ok了。

    <span id="append_finish" class="append_finish">图片插入完毕!</span>

    或者

    <a onclick="javascript:fun();return false;">加return false</a>

    修正后的htm如下:

    ul  id="imgLIst" class="img-list clear">
      <li><a href="javascript:;" onclick="insertImg(this, 1);return false;" title="第一张图"><img src="http://www.xxxx.com/images/pic/1.gif" alt="第一张图"></a></li>
      <li><a href="javascript:;" onclick="insertImg(this, 2);return false;" title="第二张图"><img src="http://www.xxxx.com/images/banks/2.gif" alt="第二张图"></a></li>

    </ul>

    图片能正常显示了 : )

  • 相关阅读:
    当今的架构师和架构
    外企2
    测试驱动开发TDD系列
    在IIS中部署WCF中遇到的问题
    设计高可用和高负载的网站系统(转载)
    IIS中部署WCF
    无限级分类1
    读《WCF技术剖析》(卷一)
    无限极列表2
    TCP/IP、HTTP、WEBSERVICE、SOAP、ICE都使用后才有感慨
  • 原文地址:https://www.cnblogs.com/xiaohong/p/2918288.html
Copyright © 2011-2022 走看看