img标签设置默认图片

场景： 当获取图片路径或读取不到图片时，显示一张默认图片代替默认当图片碎片。

解决方法： 利用img标签的onerror事件。

问题：如果defaultIcon 也不存在，则会继续触发 onerror事件，导致死循环，故会出现打开网页时提示 Stack overflow at line: 0 错误。特别说明：如果图片存在，但网络很不通畅，也可能触发 onerror事件。
解决方法：控制它不循环。

ps：按照网上的做法写onerror提示这个属性不存在，让我改成onError

更新： onerror 事件会在文档或图像加载过程中发生错误时被触发。在装载文档或图像的过程中如果发生了错误，就会调用该事件句柄。发生错误的前提是发起网络请求，即当src为undefined或null时不会触发，这种情况还需要另外去判断。
最终写法：

        <imgsrc={logo||defaultIcon}alt="图标"onError={e => {// 替换的图片e.target.src = defaultIcon;// 控制不要一直触发错误e.onError = null;}}/>

img标签设置默认图片相关推荐

图片img标签设置默认图片
图片img标签设置默认图片 1.让图片元素隐藏 2.设置默认图用户头像,默认商品图等.img的alt属性只是给图片设置未加载时的文字提示信息.这时,通常会用到onerror属性,一下为常用的两种方法 ...
vue项目设置img标签的默认图片
方法一: 首先看看以前(非vue)项目是怎么设置img标签的默认图片: // 设置默认图片 <img src="http://res.spreadwin.com/gmc38PE.jpg ...
设置img标签的默认图片
img标签的属性有: src:图片路径 width:宽度 height:高度 title:鼠标悬停在图片时显示的文字内容 alt :用来告诉浏览器当需要显示的图片找不 ...
html 如何设置选择图片,html中如何设置默认图片？
前言大家可能都知道img标签是怎么设置默认图片的,但是你知道background-img是如何设置默认图片的嘛? img 这里是应用了img标签的``事件,当加载失败就用默认图片地址.但是这里可能出 ...
微信小程序开发——设置默认图片、错误加载图片
wxml: <image src='{{imgArr[index]==""?defaultImg:imgList[index]}}' binderror="erro ...
img请求图片错误设置默认图片
当图片地址存在但无效时,给它设置默认图片或者不显示 1.让这个图片元素隐藏: <img src="图片的url地址" alt="图片XX" onerror ...
select html默认选中的值,HTML/jquery中的select标签设置默认选中取值
一.jQuery中的select标签设置默认选中取值每一次操作select的时候,总是要出来翻一下资料,不如自己总结一下,以后就翻这里了. 比如 1.设置value为pxx的项选中 $(" ...
php 下拉框默认选中,select标签设置默认选中的选项方法，select标签
select标签设置默认选中的选项方法,select标签方法有两种. 第一种通过的属性来设置选中项,此方法可以在动态语言如php在后台根据需要控制输出结果. < select id = &qu ...
img图片不存在时设置默认图片
img设置是一个圆的样子,发现调取接口之后返回img路径是空,img显示是一个正方形,找了方法解决当图片不存在时设置默认图片 <img src="图片的url地址" alt ...

img标签设置默认图片

img标签设置默认图片相关推荐

最新文章

热门文章