写了段代码:
function test(){
x = new Image(); //当图像装载完毕时调用的事件句柄。
x.src = "1.jpg";
x.onload = function(){
alert(/success/);
}
x.onerror = function(){
alert(/error/);
}
}
test();
alert("test");
当时,就是无法弹窗,问题出在x.src的位置上
来源:不详
作为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浏览器会检测缓冲区是否已经有此图片,有的话直接就触发此事件!
相关推荐
1. 事件处理程序的绑定时机:在早期的IE浏览器中,如果在设置Image对象的src属性之前绑定onload事件处理程序,可能会导致事件不被触发。在现代浏览器中,这种情况得到解决,但在较旧版本的IE中,为了兼容性考虑,...
在网页开发中,`body.onload` 和 `window.onload` 是两个常见的JavaScript事件处理函数,用于在页面完全加载后执行特定的代码。它们都是用来确保在执行任何操作之前,页面的所有资源(包括HTML、CSS、JavaScript、...
本文主要讨论的是在IE浏览器中遇到的一个特定问题,即图片的`onload`事件在某些情况下无法正常触发,导致图片加载状态的控制出现问题。 首先,我们要理解`onload`事件的作用。`onload`是HTML DOM(文档对象模型)中...
在网页开发中,我们经常需要动态加载图片,这时就需要利用到Image对象的加载事件(onload)和加载状态(complete)属性。这两个特性可以帮助我们实时监控图片的加载进度,从而实现更灵活的交互效果。 首先,`onload...
总结来说,IE浏览器中的图片`onload`事件无效问题主要是由于浏览器的图片缓存机制导致的。为了避免这个问题,开发人员应确保在设置`onload`事件处理函数后再指定图片的`src`属性。这样可以确保事件处理函数总是在...
在IE浏览器中,图片是否被显示出来决定着complete属性的值,而在其他浏览器中,如果图片之前已经被加载过并被缓存,那么complete属性值会是true。 总结来说,通过JavaScript实现图片预加载的关键点包括正确使用...
在现代Web开发中,Internet Explorer(IE)浏览器的市场份额逐渐减少,而其他非IE浏览器如Chrome、Firefox、Safari和Edge等变得越来越流行。这些浏览器支持许多先进的Web标准,但它们之间的API和事件处理可能存在...
本文实例讲述了IE8中动态创建script标签onload无效的解决方法。分享给大家供大家参考。具体分析如下: 今天做项目,发现一个奇怪的问题,动态创建的script标签在IE8下无法触发onload事件。 代码如下: 代码如下:var...
标题 "IE浏览器去掉FLASH虚线框的两种方法" 涉及的是在使用Internet Explorer(IE)浏览含有Flash内容的网页时,如何消除Flash对象周围的虚线边框的问题。这通常是一个视觉上的优化,因为虚线边框可能会影响网页的...
在IE浏览器中,用户在与Flash内容交互时,有时会看到一个烦人的虚线边框环绕在Flash对象周围。这个虚线边框是IE浏览器为了突出显示可点击或可交互区域而设计的,默认情况下,当鼠标悬停在Flash上时,它会出现。这在...
本文将深入探讨IE浏览器中`<iframe>`的`onload`事件处理,以及如何有效地判断一个`<iframe>`是否已经加载完成。 在非IE浏览器(如Firefox、Chrome等)中,我们可以直接使用`<iframe>`的`onload`事件进行绑定,例如...
### 文档模式与IE浏览器模式 #### 一、引言 随着Web技术的不断发展与变化,不同的浏览器在处理HTML和CSS的方式上存在着细微差异。为了兼容各种基于不同标准开发的网站,微软在Internet Explorer 8及之后的版本中...
JQuery onload、ready 方法详细解说 在 JavaScript 库中,JQuery 提供了两种事件处理机制,即 onload 和 ready。它们都是在页面加载完成后触发的事件,但是它们之间有着一定的区别。 首先,我们需要了解这两种事件...
IE浏览器在处理GIF动画的onload...该bug是IE浏览器在处理GIF动画的onload事件时存在的一个bug,可以通过在onload事件函数中,将onload事件设置为null来解决。同时,静态GIF、JPG、BMP等其他格式的图片不会出现这个bug。
现在,让我们深入探讨JavaScript中Image对象的使用方法以及如何高效地进行图片预加载处理。 首先,Image对象可以被创建为一个新的实例,这样就可以在不显示于HTML文档中时预读图片。创建方式很简单,可以使用var...
在探讨“IFrame中Session丢失的解决办法”这一主题时,我们首先需要理解Session与IFrame的基本概念及其在Web开发中的交互方式。Session是Web应用中用于存储用户特定信息的一种机制,它允许开发者在用户的会话期间...