3

我正在我的 javascript 代码中创建一个 Image 对象。我想将处理程序附加到此图像以进行“加载”事件。我正在尝试使用以下代码执行此操作,但从未调用处理程序方法。

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

我做错了什么还是有其他方法可以做到这一点?我已经尝试过 img.onload 但它对我不起作用。

4

1 回答 1

2

在为属性分配值之前添加事件侦听器。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.');
});
于 2013-04-08T14:32:54.077 回答