图像'src'属性更改时的JavaScript事件？

Question

我有一个函数resizePreview(),如果图像太大,将在jQuery对话框中调整图像大小.用户可以更改此图像.我的代码是这样的:

$('#imagePreview').attr('src', newImageSrc);
resizePreview();

resizePreview()使用$('#imagePreview').width()和.height()获取尺寸并相应调整大小.问题是新图像没有resizePreview()被调用时加载,因此图像根据其原始尺寸调整大小,而不是根据新加载图像的尺寸.

如果我alert()在两行代码之间进行调用就可以了(因为警报会给浏览器足够的时间来加载新图像).显然我应该使用一个活动？是否存在现有事件,或者我是否可以制作一个事件,因为当图像src发生变化时(有点像onChange事件,但对于该属性)或者当新图像完成加载时？谢谢你的时间.

Answer 1

该load活动适用于图片:

$('img.userIcon').on('load', function () {
    $(this).toggleClass( 'bigImg', $(this).height() > 100 );
});

Answer 2

图像对象允许附加onload事件侦听器:

var img = new Image;
img.onload = function () {
    alert("Loaded");
};
img.src = "dummy-picture.png";