javascript - 如何检测网页上未正确加载/未完成的图像？

Question

如何检测网页上未正确加载的图像？我使用了以下 jquery 但无法正常工作。

$('#image1').on('load', function() {
    if ($('#image1').prop('complete')) {
        console.log("image complete: true");
    } else {
        console.log("image complete: false");
    }
}).on('error', function() {
    console.log("image loaded error");
}).attr("src", imgUrl);

编辑1

$("#image1").on('load', function() {
    console.log("image1 complete: true " + this.width + "x" + this.height);
}).attr("src", imgUrl);
$('#image1')[0].decode().then(() => console.log('decoded'))

编辑2

$("#liveImage1").on('load', function() { 
    createImageBitmap(this).then(() => {
        console.log('Loaded');
    }).catch(() => {
        console.log('Failed');
    })
}).attr("src", imgUrl);

标签： javascripthtmljqueryweb

Answer 1

您可以使用.load()事件处理程序，如下所示：

$("#image1").on('load',function() {
  alert('I loaded!');
}).attr('src', 'image1.jpg');