• 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>

    图片能正常显示了 : )

  • 相关阅读:
    每日总结
    每日总结
    每日总结
    每日总结
    每日总结
    每日总结
    每日总结
    配置SpringMVC(两天)
    layui学习4(三天的)动态表格
    layui的学习使用3表单
  • 原文地址:https://www.cnblogs.com/xiaohong/p/2918288.html
Copyright © 2020-2023  润新知