前端监听图片加载异常-自动替换默认图片

 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
<img src="https://upload-imag1es.jianshu.io/upload_images/2666001-57f1523c3f469016.png?imageMogr2/auto-orient/strip|imageView2/2/w/650/format/webp" 
    onerror="noFind(this);" />
    <script>
        function noFind(event){
            console.log("event",event)
            var img = event;
            img.src = "https://pic.cnblogs.com/avatar/1505226/20191123150748.png"  // 默认图片地址
            img.onerror = null;  // 控制不要循环展示错误
        }
    </script>
</body>
</html>

 

posted @ 2020-05-06 17:31  expworld  阅读(426)  评论(0)    收藏  举报