js判断图片加载失败时自动显示默认图片onerror

0 228 2022-06-05 03:18:23

本文目录

1. html代码
2. js代码

页面图片加载失败是一个比较常见的bug，图片位置挪动、图片服务器过期、链接引入有误等问题多可能导致图片加载失败。那么，怎样用js在图片加载失败时自动显示默认图呢？

html代码

<img src="/images/pic.jpg" alt="引入的图片" onerror="notfind(this);">

js代码

function notfind(img){ 
    img.src="/static/images/notimg.png"; 
    img.onerror=null; //如果错误图片也不存在就会死循环一直跳，所以要设置成null，也可以不加
}

这样，如果资源图片加载失败时，就会自动显示默认图片。

本文地址：https://xzo.com.cn/develop/js/1092.html

有帮助，很赞！

信息来源：下载鸥

业务合作

如果您认可我们的分享，有意与我们合作开展帝国cms网站建设与开发业务或插件定制，请联系右侧在线客服。我们能给您的，就是高质量的模板与售后。

版权声明

标注了信息来源为下载鸥的文章皆为原创，如果是转载的优质文章，我们也都标注了出处。如果您喜欢我们的文章，请按照下载鸥所标注的文章出处进行标注，谢谢您的配合。

信息标签

导出教程下载word版教程

关于JS/JQuery

JavaScript（简称“JS”）是一种具有函数优先的轻量级，解释型或即时编译型的编程语言。JavaScript 基于原型编程、多范式的动态脚本语言，并且支持面向对象、命令式和声明式（如函数式编程）风格。

JavaScript十分强大，不管是前端页面开发、视觉动态渲染、数据交互还是后端逻辑处理，都可以通过JS实现。虽然它是作为开发Web页面的脚本语言而出名，但是它也被用到了很多非浏览器环境中。

js判断windows操作系统还是mac os系统

js网站视频播放器ckplayer和dplayer优缺点分析

禁止指定城市/省份IP访问JS代码

推荐JS/JQuery开发教程

jquery怎样获取textarea用户输入的行数？ jQuery是一个相当好用的js插件，通过jquery我们可以实现很多功能，例如今天要介...: 0 444

$(window).height() 和 $(document).height()有什么不同？ 我们常用$(window).height() 和 $(document).height()来监听当前高度，但这个...: 1 279

JS点击复制data-*属性（支持多个元素） 分享一段js原生点击复制data-*属性的源码，根据onclick事件触发，复制当前元素...: 0 293

jQuery监听点击事件弹出关注二维码教程 通过jQuery实现点击关注按钮弹出二维码是一个比较常用的功能，今天鸥哥讲讲这...: 0 367

js点击追加信息到textarea 通过灵活运用js，我们可以轻松实现点击追加相关信息到textarea的功能。这个功...: 0 471

js网站视频播放器ckplayer和dplayer优缺点分析 dplayer和ckplayer都是非常流行的web视频播放器，二者都占有相当大的用户市场...: 0 1321

JS获取浏览器语言（中英文多语言站）并自动跳转代码 如果是多语言站点，主动获取浏览器默认语言并自动进行跳转可以有效降低跳出率...: 0 761

jQuery怎样给图片添加默认域名？ 在很多网站中，图片的默认路径是相对于根目录的绝对路径，如果是其他站点引用，则...: 0 349

随机JS/JQuery开发教程

js输入页码并跳转到指定分页怎么做？ 网站分页用于将数据分开，但在一些极端的场景，如用户需要找到指定时间段的信息...: 0 94

JS判断页面是否是第一页并决定是否显示指定内容 JS判断当前页面是否是栏目第一页，并决定是否显示指定内容。例如，我们的栏目页...: 0 258

Mac下配置sublime里的sass编译 如何安装ruby、如何配置sublime的SassBuild插件网上已有一堆教程，在此不做复...: 0 254

swiper在鼠标移入后停止轮播，移出后继续轮播 swiper是一款很常用的轮播插件，支持的轮播效果十分丰富。那么，swiper怎样在鼠...: 1 373

CSS3动画：鼠标上移后顶部线条向两侧展开 通过css3，我们可以制作很多炫酷的动画交互效果。今天鸥哥给大家分享的是通过...: 0 300

CSS3动画：鼠标上移后颜色从中间向两边填充 CSS3动画：鼠标上移后颜色向中间靠拢是一个看起来很有档次的CSS3动画，很多人不...: 0 303

一段常用的css文件base.css 不管是基于何种后端程序的网站，必不可少的是base.css文件。该文件用于清除一...: 0 204

jQuery的load()方法怎么用，报错/无效怎么办？ jQuery的load方法可以在当前页面引入新页面的代码，但如果直接测试，我们会发现...: 0 537