关于IE中image的onload事件失效解决问题
来源:互联网 发布:免费售楼软件 编辑:程序博客网 时间:2024/04/30 17:44
这两天做一个简单的图片查看器,其中用到了“上一页”和“下一页”,加载图片的时候用new Image(),然后设置image的src属性,在Google Chrome/Opera/FireFox中一切正常;代码如下:
1 var i = new Image();2 i.src = _this.settings.imgs[_this.currIndex];3 //baidu.dom.show(baidu.dom.query(selectPre+'#loading')[0]);4 i.onload = function(){5 image.src = i.src;6 baidu.dom.hide(baidu.dom.query(selectPre+'#loading')[0]);7 baidu.dom.query('#'+_this.settings.formId+' .title')[0].innerHTML = i.src.replace(/(.*\/)/ig,'') + ' - '+_this.settings.title;8 }
测试结果:
可是到了IE8/IE7中,问题出现了:当所有图片一次翻完或者刷新浏览器后,点击后图片就 不显示了,下面是刷新后的结果(红色的图片是loading图标):
难道是Image对象的onload失效了?当我试图在onload事件中弹出对话框时,IE中无效,也就证实了onload事件没有发生。网上搜索了下资料:
IE在再次显示图片的时候不是从服务器发来的图片,而是从缓存中获取上次缓存的,这样从缓存中加载的速度是很快的,所以还没有运行到onload的时候,onload事件已经触发了,这就导致onload事件中的代码无法执行了。
既然这样,那我们就可以把onload事件函数写到给src赋值的语句前面,这样就解决了问题,代码如下:
var i = new Image();//baidu.dom.show(baidu.dom.query(selectPre+'#loading')[0]);i.onload = function(){ image.src = i.src; //baidu.dom.hide(baidu.dom.query(selectPre+'#loading')[0]); //baidu.dom.query('#'+_this.settings.formId+' .title')[0].innerHTML = i.src.replace(/(.*\/)/ig,'') + ' - '+_this.settings.title;} i.src = _this.settings.imgs[_this.currIndex];
嘿嘿,实际中遇到了一些奇怪的问题,记录一下。
0 0
- 关于IE中image的onload事件失效解决问题
- IE中Image.onload失效的问题
- IE浏览器中Image对象onload失效的…
- IE浏览器中Image对象onload失效的解决办法
- IE浏览器中Image对象onload失效的解决办法
- IE浏览器中Image对象onload失效的解决办法
- IE中Image对象onload失效问题
- IE中Image .onload的问题
- IE8浏览器中Image对象onload失效的解决办法
- 解决IE中img.onload失效的方法
- 解决IE中img.onload失效的方法
- 解决IE中img.onload失效的方法
- JS的 image onload事件
- html中body的事件onload定义的函数失效
- Image onload 事件
- Image onload 事件
- IE下的iframe的onload事件
- 给ie的iframe注册onload事件
- Mac使用zsh导致maven命令无效的解决方案
- 【Java】内部类与外部类的互访使用小结
- php-代码优化准则
- 如何在项目启动的时候做一些业务处理 (实现ServletContextListener)
- HTML5 - 用<figure/>添加插图和图题
- 关于IE中image的onload事件失效解决问题
- UFUN学习板的测试与学习
- 数据库事务的特点与隔离级别
- spring配置错误Could not find acceptable representation
- Fragment生命周期
- iOS-UIStackView的演练
- Linux开启FTP共享操作
- 学习工具、教程 推荐
- 读取java项目下的文件