addEventListener()在Firefox中对图像不起作用

addEventListener() not working for image in Firefox

本文关键字:图像 不起作用 Firefox addEventListener      更新时间:2023-09-26

我正在我的javascript代码中创建一个图像对象。我想附加一个处理程序到这个图像的"加载"事件。我正在尝试使用以下代码,但处理程序方法从未被调用。

var img = new Image();
img.src='some url';
img.addEventListener('load', function(){
      //do something
}, false);

是我做错了什么还是有其他的方法来做这件事?我已经试过了。

在为src属性赋值之前添加事件侦听器。如果图像已经在浏览器的缓存中,load事件可能会在设置src属性后立即发生。

另外,确保将对Image对象的引用保存到一个变量中,该变量在下载图像之前不会自动销毁。例如,如果您在函数中实例化一个Image对象,并在函数局部变量中保存对它的引用,则该对象可能会在函数执行完成后自动销毁。要防止这种情况发生,可以将对该对象的引用保存在全局变量或全局对象的属性中,如下所示:

window.example = {
    _images: []
};
example.preloadImage = function(url, callback) {
    var image = new Image;
    image.onload = callback;
    image.src    = url;
    // This prevents the image from destroying after the function is executed.
    example._images.push(image);
};
example.preloadImage('some-image.jpg', function() {
    alert('Image is loaded.');
});