IE浏览器中Image对象onload失效的解决办法
作为WEB设计者,为了在网页展示上加强用户体验,经常会利用图象载入显示状态方法,这自然需要Image对象的onload事件。 在firefox浏览器下完成开发后,可是在IE浏览器中进行调试总不能被调用。不管是最新版的IE8还是旧版本的IE7和IE6都无效,最初的代码简化后如下:
var img = new Image();
img.src = "test.gif";
img.onload = function(){
alert(this.src);
//other
};
简单看过以后貌似这段代码没有什么问题,可是IE下就不是能正常的运行。不管怎么检测,IE根本不会理会,不过还是找到了解决的方法,原理如下:
图片下载时,浏览器会把图片缓存起来,再次加载此图片时就会从缓冲区里加载。
那么如果图片已经在缓存区了,是不是从缓冲区里加载的图片就不触发onload事件呢?
测试……
var img = new Image();
img.onload = function(){
alert(this.src);
//other
};
img.src = "test.gif";
测试成功!
结论:应该把onload写到src前面,先告诉浏览器图片加载完要怎么处理,再让它去加载图片。 所以,不是IE浏览器不会触发onload事件,而是因为加载缓冲区的速度太快,在没有告诉它加载完要怎么办时,它已经加载完了。反过来说,firefox明显更智能一些,加入onload事件后,firefox浏览器会检测缓冲区是否已经有此图片,有的话直接就触发此事件!
文章来自:http://www.iefans.net/ie-image-duixiang-onload/
IE浏览器中Image对象onload失效的解决办法的更多相关文章
- 安装wampserver之后,浏览器中输入localhost页面显示IIS7解决办法
1.wampserver图标为绿色才为正常启动,如果为橘色说明端口(默认为80)被占用:可以点击图标,然后点Apache->Service->测试80端口,来验证端口是否被占用. 如果占用 ...
- Win7下多线程中OpenFileDialog和SaveFileDialog失效的解决办法(转载)
在程序中,通常会使用独立线程来操作OpenFileDialog或者SaveFileDialog控件,但是在某些情况下(Win7系统下)调用 ShowDialog方法并不显示选择路径对话框.此时需要对启 ...
- js_html_input中autocomplete="off"在chrom中失效的解决办法 使用JS模拟锚点跳转 js如何获取url参数 C#模拟httpwebrequest请求_向服务器模拟cookie发送 实习期学到的技术(一) LinqPad的变量比较功能 ASP.NET EF 使用LinqPad 快速学习Linq
js_html_input中autocomplete="off"在chrom中失效的解决办法 分享网上的2种办法: 1-可以在不需要默认填写的input框中设置 autocompl ...
- [转]iOS Safari 中click点击事件失效的解决办法
iOS Safari 中click点击事件失效的解决办法 问题起因: 在微信公众号开发(微站)过程中用jquery的live方法绑定的click事件点击无效(不能执行) 问题描述 当使用委托给一个元素 ...
- iOS Safari 中click点击事件失效的解决办法
问题起因: 在微信公众号开发(微站)过程中用jquery的live方法绑定的click事件点击无效(不能执行) 问题描述 当使用委托给一个元素添加click事件时,如果事件是委托到 document ...
- jquery中checkbox全选失效的解决方法
这篇文章主要介绍了jquery中checkbox全选失效的解决方法,需要的朋友可以参考下 如果你使用jQuery 1.6 ,代码if ( $(elem).attr(“checked”) ),将 ...
- vue中router-link的click事件失效的解决办法
title: vue中router-link的click事件失效的解决办法 toc: false date: 2018-12-04 16:28:49 categories: Web tags: vue ...
- IE6/IE7下margin-bottom失效兼容解决办法及双倍边距问题
(从已经死了一次又一次终于挂掉的百度空间人工抢救出来的,发表日期 2014-04-08) 一.IE6/IE7下margin-bottom失效兼容解决办法 1.用padding-bottom代替:2.在 ...
- SpringBoot在Impl类中调用其它service层失败解决办法
在AImpl.java文件中引用BImpl.java的方法,编译正常,运行到调用的地方,报空指针异常,跟踪到异常位置,发现service为空,也就是按照之前controller层通过@Autowire ...
随机推荐
- Java基础知识回顾
Java回顾之I/O Java回顾之网络通信 Java回顾之多线程 Java回顾之多线程同步 Java回顾之集合 Java回顾之序列化 Java回顾之反射 Java回顾之一些基础概念 Java回顾之J ...
- 关于webStrom-11.1配置less且自动生成.css和自动压缩为.min.css/.min.js
网上看过很多配置思路,自己总结了以下, 就把我个人配置的顺序以及材料分享下,webstrom以下简称WB 1.配置less需要安装nodejs,自行安装.因为要用到npm.我是直接把npm解压到C盘根 ...
- JavaScript学习笔记7 之DOM文档对象模型
一.什么是DOMDocument Object Model 文档 -------对象 ----模型-------缩写DOM DOM是针对HTML和XML文档的一个API(应用程序编程接口).DOM描绘 ...
- MYSQL新手入门篇
一.数据库的简介 什么是数据库? 数据的仓库,如:在atm的实例中我们创建一个db目录称之为数据库 什么是 MySQL.Oracle.SQLite.Access.MS SQL Server等 ? 他们 ...
- 好像越来越觉得 SharePoint “难用”了
一开始,我觉得 SharePoint 很神秘,不知道它到底是用来做什么的. 后来,我觉得 SharePoint 很强大,能做很多事情. 再后来,我觉得,SharePoint 没有他们宣传的那-么强大, ...
- SharePoint 2013 托管导航及相关配置 <二>
本文的思路是使用JQuery重写SharePoint自带托管导航的样式,其实思路和脚本都非常简单,引用一下JQuery脚本,然后重写导航的样式,把脚本放到母版页中,即可.当然,使用JQuery可以做很 ...
- ArcSDE10.2.2使用SQL操作ST_Geometry时报ORA-28579
给esri中国的客服打电话被告知,是一直存在这个bug,arcgis10.2对应的oracle数据库版本要用11.2.0.3及以上的: 1.数据库升级可以用打补丁的当方式. 2.直接重装,我这里是直接 ...
- 利用Civil 3D API更改曲面的样式
如果你需要更改曲面的样式,比如更改等高线的颜色等等,在Civil 3D中,你可以通过在toolspace中选中曲面,然后点右键选择“Edit surface style…”然后切换到“Display” ...
- Mac系统下Android生成keystore
首先打开终端(在搜索里面搜索Te即可出来) 然后输入 cd /Library/Java/Home/bin/ 然后这步很关键,由于我们用的是当前用户,所以没有最高权限,不能在Library文件夹下生成 ...
- 优质Android小部件:索尼滚动相册
虽然骚尼手机卖的不怎么样,但是有些东西还是做的挺好的,工业设计就不用说了,索尼的相册的双指任意缩放功能也是尤其炫酷.其桌面小部件滚动相册我觉得也挺好的,比谷歌原生的相册墙功能好多了,网上搜了一下也没发 ...