【一】、如下片段是当晚在IE7、8及FF中测试执行成功的:
-----------------------------------------------------------------------------------------
如下代码:
02 |
var img = new Image();
|
06 |
alert( '该图片已经存在于缓存之中,不会再去重新下载' );
|
09 |
img.onload = function () {
|
使用Image对象的complete属性来判断指定图片是否已经存在缓存之中,当complete属性为true是该图片则已经存在于缓存之中,否则反之。
-----------------------------------------------------------------------------------------
【二】、今早使用IE9中测试竟然无效,判断img.complete总为false,是的确未缓存么?但之后的load事件并未执行,说明浏览器的确缓存了这些图片。但为何img.complete返回为false呢?
请看如下对img.complete属性的解释
-----------------------------------------------------------------------------------------
img.onload事件和img.complete属性的简介和应用
img.onload是当一张图片被加载完成后所触发的事件
实现图片显示功能;
<div>
<img id="img"/>
</div>
js部分:
对于 complete 属性来讲,IE是根据图片是否显示过来判断,就是说当加载的图片显示出来后,complete 属性的值才为 true ,否则一直是 false ,和以前是否加载过该张图片没有关系,即和缓存没有关系!这里要注意,显示与否和img.style.display无关;JS部分:
-----------------------------------------------------------------------------------------
于是乎,你懂了,为什么在IE9中无效了。。。。再于是,你对发表第一个片段日志的码农想说一句:咋这么不负责呢?(看来,盗版的东西还是不太可靠啊,必须自己动手测试才行)
【三】、最终解决方案
5 |
if (img.complete||img.width) {
|
6 |
alert( '该图片已经存在于缓存之中,不会再去重新下载' );
|
于是你又发现,你竟然只加了一个或判断。。
解释一下,添加img.naturalWidth获取图片原始尺寸,当图片未加载(未缓存、或加载失败)时该值为0,当然如果有缓存的话,返回的就是图片的原始尺寸。
所以img.complete||img.naturalWidth 在js onload事件之前,如果图片已经显示,或获取的尺寸大于零,表示图片onload之前已经加载完成。
PS:naturalWidth只有高版本浏览器支持(safari,firefox,chrome,与opera10+),低版本的话,直接用img.width
相关推荐
创建一个Image对象,实现图片的预下载,如果图片已经存在于浏览器缓存,直接调用回调函数,使用onload事件可以判断图片是否加载完成 function loadImage(url, callback) { var img = new Image(); //创建一个Image...
检查是否为一个合法的时间格式 检测URL地址有效性 检测文件是否图片 检测是否可以以网页形式显示 检测是否序列化后的字符串 模仿JAVASCRIPT的ESCAPE和UNESCAPE函数的功能 用curl函数读取远程文件 用file_get...
安卓上用于加载的Webview视图窗口只是作为类浏览器而存在,在安卓上更是只能同时运行一个Webview。(2)跨域数据交互问题。不同的Webview之间无法共享数据。(3)页面自适应问题。页面难以兼容适应不同分辨率的设备...
ENTER键可以让光标移到下一个输入框 (event.keyCode==13)event.keyCode=9"> 文本框的默认值 (this.defaultValue)"> title换行 obj.title = "123
sdfs " 获得时间所代表的微秒 var n1 = new Date("2004-...
7.9 检查图像是否已经被完全加载 7.10 单击改变背景图案 7.11 如何显示Flickr网站的图片 7.12 如何显示Google Picasaweb的图片 7.13 按比例调整图片的大小 7.14 滑动效果的背景图片 7.15 动态表单生成图片预览 7.16 ...
这是我花了差不多半个星期写的个人主页 Tips:本页面效果比较多,并没有做到很好的兼容; 所以推荐在chrome中浏览! 地址: 本人博客地址是: 欢迎大家来访问; 以下讲页面---: 页面其中,应运了插件: aui-core-...
1.[*紧急修复]修复次页存在的一个xss攻击安全漏洞 2.纠正当新的验证码无法使用时系统自动切换到传统数字验证码 3.其他几个小细节纠正 2012年03月27日 1.后台每页显示个数增加最大200限制 2.网站验证码改为富...
URL(URL 中域信息之后的部分,包括查询字符串(如果存在)) 3、获得当前完整Url地址 4、过滤危险字符串 5、替换html中的特殊字符 6、恢复html中的特殊字符 7、检查一个字符串是否可以转化为日期,...
鼠标放在一个连接上,会显示图片(类似tooltip) 使用microsoft.web.ui.webcontrols的TabStrip与IFame组件,达到页的切换效果 HttpModule 实现 ASP.Net (*.aspx) 中文简繁体的自动转换,不用修改原有的任何代码,直接部署...
共有50多款各种功能的插件,已经形成了一个非常强大的插件库,绝对满足您的一切需求.....等你来安装! 03.专辑专题系统 强大的专题系统提供普通的专辑功能,提供专辑模板可以完全自定义的功能形成专题!专题可以...
• sample41.htm 判断一个对象是否是另一个对象的原型对象 • sample42.htm 判断对象的属性是否可以被枚举 • sample43.htm 监视属性值的变化情况 第10章(\代码\第10章) • sample01....
进去之后会触发一个页面刷新的方法,之后在里面填写寄存产品的信息 其中,会员信息和产品信息都是从数据库中查询出来的,可以进行自动赋值,还有寄存单号是自动生成的随机数,之后金额的value也是在后台自动计算出来...
+PageManager.Instance应该存在于HttpContext.Current,而不是一个全局变量。 -这个BUG导致Asp.net compatibility中的示例无法完成,现在已经修正。 +去除PageManager中方法AddAjaxAspnetControls,增加属性...
+PageManager.Instance应该存在于HttpContext.Current,而不是一个全局变量。 -这个BUG导致Asp.net compatibility中的示例无法完成,现在已经修正。 +去除PageManager中方法AddAjaxAspnetControls,增加属性...
目前新型网站更多的采用浏览器缓存,cookie会存在一些问题,比如你每次往服务器提交请求时,都会带上cookie,无论是你访问的是不是静态图片。 cookie例子: 二 Session session类似服务器端的cookie,保存于服务器...
●添加文章勾选“是否显示评论链接”,前台列表显示时不能在标题旁显示“评论”链接。 ●“加密文章内容页”模板在改变字体大小与收藏的功能不起作用。 ●“通用信息列表”标签日期参数调用错误。 ●“通用信息...
第一个python程序 变量 字符编码与二进制 字符编码的区别与介绍 用户交互程序 if else流程判断 while 循环 while 循环优化版本 for 循环及作业要求 第2周 本节鸡汤 模块初识 pyc是什么 python数据类型 bytes数据...
修复积分兑换推送信息,不受重要动态是否开启限制(但只显示于积分兑换页) 修复有奖转发与活动里的内容过滤问题 修复自定义添加顶部导航时左侧导航没有显示的问题 修复有奖转发后台不能编辑的问题 修复有奖转发...
修复积分兑换推送信息,不受重要动态是否开启限制(但只显示于积分兑换页) 修复有奖转发与活动里的内容过滤问题 修复自定义添加顶部导航时左侧导航没有显示的问题 修复有奖转发后台不能编辑的问题 修复有奖转发...