当src获取不到图片,onerror可指定一张默认的图片
<img src="img/789.png" onerror="javascript:this.src='img/123.png';" alt="pic" />
注意:当img/789.png图片不存在时,将触发 onerror,而 onerror 中又为 img 指定一个 img/123.png图片。也就是说图片存在则显示 img/789.png,图片不存在将显示img/123.png。但问题来了,如果 img/123.png也不存在,则继续触发 onerror,导致循环,故出现错误。
说明:如果图片存在,但网络很不通畅,也可能触发 onerror。
解决方法:
第一种::.去掉 onerror 代码;或者更改 onerror 代码为其它;或者确保 onerror 中的图片足够小,并且存在。
第二种:
(1):
<img src="img/123.png” onerror="nofind();" />
<script type="text/javascript">
function nofind(){
var img=event.srcElement;
img.src="http://www.cnblogs.com/sys/common/image/fileoperation/icon/default.gif";
img.onerror=null; 控制不要一直跳动
}
</script>
(2):
<img src="?" id="imgId" onerror="this.onerror=null;this.src='images/noavatar.png'">
<script>
document.getElementById("imgId").src = window.location.origin+"/api/uc/download_img/"+userData.userId;
</script>
当src获取不到图片,onerror可指定一张默认的图片的更多相关文章
- vue中图片返回404时,显示默认的图片
图片返回404时候的处理 <img :src="userMsg.portrait" ref="img" alt=""> _thi ...
- img标签中的图片加载异常时显示默认的图片
备忘:
- vue自定义指令,比onerror更优雅的方式实现当图片加载失败时使用默认图,提供三种方法
首先,来看下效果图(演示一下图片正常加载与加载失败时的效果) 在线体验地址:https://hxkj.vip/demo/vueImgOnerror/ 一.常规方法解决 我们都知道,img标签支持one ...
- 多个iframe中根据src获取特定iframe并执行操作
多个iframe中根据src获取特定iframe并执行操作 前言:在项目中做一个批量编辑工单时需要在一大堆的iframe中的某一个iframe里边再用模态框的形式显示编辑区域,然后再在模态框里边加入i ...
- 火车头dede采集接口,图片加水印,远程图片本地化,远程无后缀的无图片本地化
<?php /* [LocoySpider] (C)2005-2010 Lewell Inc. 火车采集器 DedeCMS 5.7 UTF8 文章发布接口 Update content: 图片加 ...
- 【js】【图片显示】js控制html页面显示图片方式
js控制html页面显示图片方式,只需要引入“jquery-1.11.2.min.js” js: /* 引用 <script src="jquery-1.11.2.min.js&quo ...
- java后台中处理图片辅助类汇总(上传图片到服务器,从服务器下载图片保存到本地,缩放图片,copy图片,往图片添加水印图片或者文字,生成二维码,删除图片等)
最近工作中处理小程序宝箱活动,需要java画海报,所以把这块都快百度遍了,记录一下处理的方法,百度博客上面也有不少坑! 获取本地图片路径: String bgPath = Thread.current ...
- 图片的另一种展现—将后台图片编码直接展现为图片
1.应用场景 开发过程中,遇到这样的需求:需要将服务器上的图片展现在页面上,但是图片所在服务器不是对外的,图片所在服务器与应用服务器也不在同一台机器上,这时候就需要在开发中先将图 ...
- js 压缩图片(只缩小体积,不更改图片尺寸)
1.情景展示 如上图所示,点击上传图片按钮,调用手机摄像头拍照功能. <input onchange="javascript:imgFun.uploadPicture();&quo ...
随机推荐
- centos linux服务器apache+mysql环境访问慢优化方法
查找软件安装目录:find / -name 软件名称 一.优化apache配置增加MaxClients的值 默认情况下,2.0及以上apache版本MaxClients的值为256,对于中大型应用访问 ...
- JavaScript 原生控制元素添加删除
参考: https://blog.csdn.net/leijie0322/article/details/80664554 https://www.cnblogs.com/jpfss/p/910620 ...
- python爬虫与mysql,mongobd(1)(2)第一个视频python_pymysql 安装与使用类型,import解决 问题之模块引ru 就是解决你的问题
import pymysql.cursors ''' 1.创建连接 2.创建游标 3.执行sql 5.接受结果 ''' # 1.连接 connection =pymysql.Connect( # 域名 ...
- selenium--启动不同的浏览器
在自动化测试经常用到 Firefox,Chrome,IE 浏览器,Firefox 自带驱动,所以我一直用这个测试.那么同一段代码能不能在同时打开两个浏览器呢?当然是可以,浏览器名称参数化. 重点:Ch ...
- CreateRemoteThread创建远程线程
要实现线程的远程注入必须使用Windows提供的CreateRemoteThread函数来创建一个远程线程 该函数的原型如下: HANDLE CreateRemoteThread( HANDLE hP ...
- eclipse下载安装
1.下载 网址:https://www.eclipse.org/downloads/ 找到:eclipse-inst-jre-win64.exe 下载... 2.安装 找到-->Eclipse ...
- pdb的插拔测试
pdb的插拔测试:将pdb从一个cdb中,插拔到另一个cdb中. 源端pdb unplug SQL> select instance_name from v$instance; INSTANCE ...
- java/ kotlin下的单例模式
单例模式属于创建型模式, 顾名思义,就是说整个系统中只有一个该对象的实例. 为什么要使用单例模式? 1, 对于一些需要频繁创建,销毁的对象, 使用单例模式可以节省系统资源 2, 对于全局持有的对象,单 ...
- 前段之BOM ----DOM
一.介绍 BOM(Browser Object Model)是指浏览器对象模型,它使 JavaScript 有能力与浏览器进行"对话". DOM (Document Object ...
- CF992E Nastya and King-Shamans(线段树二分+思维)
这是一道卡常好题 从160s卡到36s qwq 由于题目设计到原数组的单点修改,那么就对应着前缀和数组上的区间加. 很显然能想到用线段树来维护这么个东西. 那么该如果求题目要求的位置呢 我们来看这个题 ...