应用场景

在开发中，经常遇到一种情况，数据库不存在图片地址，或者存在图片地址，但图片已经被删除，这个时候会出现加载失败情况。提供以下解决方案

解决方案

在 img 标签 加上onerror="onerror=null;src='123.jpg'" ,即当图片加载失败时会自动加载123.jpg ，例如

<img src="abc.jpg" onerror="onerror=null;src='123.jpg'" />

<img> 标签 图片加载失败时候处理方案的更多相关文章

  1. img error 图片加载失败的最佳方案

    有时候, 当img的src加载失败, 会显示缺省碎片图片,  影响用户体验.  有一个js事件onerror就派上了用场. 它可以在加载失败时, 显示缺省的图片. 它有两种使用方式. 第一种: 使用纯 ...

  2. AngularJS中如果ng-src 图片加载失败怎么办

    我们知道AngularJS加载图片的方法是用技术分享加ng-src标签,例如: <img ng-src="{{currentUrl}}"/> 其中currentUrl为 ...

  3. js 图片加载失败处理方法

    在项目中不可避免会用到图片,尤其是列表,有时候图片会加载失败:这样就会显示一个很难看的坏图片缩略图:下面介绍两种方法,解决这个问题: 1.如果在你的项目中有引入jQuery插件,你可以使用error( ...

  4. 当h5页面图片加载失败后，给定一个默认图

    本文主要讨论页面中图片加载失败后替换默认图片的几种方式 重点来了:一定要记住error事件不冒泡. 相关的知识点:jquery的ready方法.$("img").error().i ...

  5. css背景图片加载失败，页面部分图标无法显示

    1.问题表现:首屏缺失部分图标.点击按钮切换为激活状态时,部分按钮的激活态图标无法显示. 2.问题原因:网络极差,断断续续,点击时添加class:active变为激活态, active.png这张图片 ...

  6. 当图片加载失败时更换图片， Firefox onerror 报错

    当图片加载失败时更换图片. <!DOCTYPE html> <meta charset="UTF-8"> <img src="http:// ...

  7. WebForm、MVC图片加载失败处理

    还是那个该死的WebFrom项目,部分功能替换为MVC后感觉好多了,但是WebForm.MVC都有图片加载失败时显示提示图片的需求,并且统一在js中处理.问题来了,js中图片路径怎么处理呢?现场有可能 ...

  8. JavaScript-onerror事件:图片加载失败后不显示

    HTML: <img src="http://www.mazey.net/images/upload/image/20170518/1495122198180663.gif" ...

  9. angular 图片加载失败 情况处理？ 如何在ionic中加载本地图片 ?

    1.angular 图片加载失败 情况处理 在directive中定义组件,在ng-src错误时,调用err-src app.directive('errSrc',function(){ return ...

随机推荐

  1. LeetCode-094-二叉树的中序遍历

    二叉树的中序遍历 题目描述:给定一个二叉树的根节点 root ,返回它的 中序 遍历. 示例说明请见LeetCode官网. 来源:力扣(LeetCode) 链接:https://leetcode-cn ...

  2. 一台电脑设置多个网段的IP地址

                    

  3. 安卓手机APP兼容性测试如何有效进行？

    Android App兼容性测试是一个比较重要的App评价内容,实际上兼容性测试不仅仅和测试人员相关,在开发阶段就应当着重考虑,因为兼容性问题是除了实现App本身要求的功能后,必须要关注.而且至关重要 ...

  4. Jmeter压测场景及结果分析

    1)压力测试分两种场景: 一种是单场景,压一个接口的: 第二种是混合场景,多个有关联的接口. 压测时间,一般场景都运行10-15分钟.如果是疲劳测试,可以压一天或一周,根据实际情况来定. 2)压测设置 ...

  5. nginx配置负载均衡分发服务器笔记

    记录学习搭建nginx负载均衡分发服务器的过程笔记 1.服务器IP:192.168.31.202(当前需要搭建nginx负载均衡分发的服务器)安装好nginx 2.在服务器IP:192.168.31. ...

  6. 一比一还原axios源码（四）—— Axios类

    axios源码的分析,到目前为止,算上第0章已经四章了,但是实际上,还都没有进入axios真正的主线,我们来简单回顾下.最开始我们构建了get请求,写了重要的buildURL方法,然后我们处理请求体请 ...

  7. Kubernetes：Ingress总结(一)

    Blog:博客园 个人 参考:Ingress | Kubernetes.<Kubernetes进阶实战>.<Kubernetes网络权威指南 > 何谓Ingress?从字面意思 ...

  8. LGP6788题解

    太慢了!太慢了!我的替身 [The World] 是最强的替身! \(O(n^{\frac 2 3})\) 的解法!不清楚用 sbt 能不能更快一些,可能会吧.灵感来源于BZOJ4176,同时也可看到 ...

  9. Django基础五之Ajax

    Django基础五之Ajax 目录 Django基础五之Ajax 1. Ajax介绍 2. Ajax前后端传值 2.1 方法一HttpResponse直接返回 2.2 方法二使用Json格式返回 2. ...

  10. TypeError: put() missing 1 required positional argument: 'item'问题分析

    今天博主在练习带参数线程池的时候与到了如下问题: 翻译过来,就是缺少位置参数. 一.错误1 如果此时你的代码高亮是这样: 解决办法:在init魔法方法下的Queue没有加括号,即 self.q = Q ...