记录每一个小坑、大坑

利用image对象的onerror事件来判断,出错则更换image对象的src为默认图片的 URL

  • html 代码
<img src="./img/No_Pics.jpg" onerror="javascript:this.src='./img/No_Pics.jpg'" alt=""  id="img">
  • js 赋值
var truepic = `./Pic/${getdata.USER_NAME}.jpg`
$("#img").attr("src", truepic)

  • 直接应用函数($\color{red}{引用菜鸟教程例子}$)
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>菜鸟教程(runoob.com)</title>
</head>
<body><img src="data:image.gif" onerror="

判断图片是否存在,不存在则显示默认图片相关推荐

  1. JS 判断图片是否是否存在--不存在则显示默认图片

    1.最简便的方法:使用 img 的 onerror 事件 https://www.jb51.net/article/8796.htm 正常显示前者,错误时显示后者 <img src=" ...

  2. 判断远程图片是否存在,否则替换成默认图片

    來源:http://www.jscode.cn/jave_img/350603662.htm <html> <head> <meta http-equiv="C ...

  3. Vue.js项目中,当图片无法显示时则显示默认图片

    Vue.js项目中,当图片无法显示时则显示默认图片使用onerror方法 最近在学习Vue时,遇到了一个问题,就是从后台传过来的图片路径无效时,需要在页面显示默认图片 本人试了3种方法,2种方法失败了 ...

  4. vue 图片 404 显示默认图片

    写在前: vue中循环显示图片,报错404,未加载图片的情况下可以使用默认图片 使用线上图片: <img :src="oneurl" alt="图片" o ...

  5. img标签无图片或者图片url错误时显示默认图片

    img标签无图片或者图片url错误时显示默认图片 如上图,四个img标签中插入四张图片. 核心:οnerrοr="this.src='默认图片路径' " 当img标签src路径错误 ...

  6. HTML显示默认图片实现

    很多时候,在HTML中显示图片时希望如果图片不存在或者无法显示时,能够显示默认图片. 可以通过以下方式: <img src="xxx.jpg" onError="t ...

  7. js中图片加载失败,显示默认图片

    js处理img标签加载图片失败,显示默认图片 1.第一种方法: 如果已经引入了jquery插件,就很好办.没有的话,如果实在需要,可以附上代码: $('img').error(function(){$ ...

  8. 当图片404时显示默认图片

    当图片404时显示默认图片 1.当图片未找到时或者404时,触发onerror显示其中的图片 eg: <img src="当前图片的地址" onerror="thi ...

  9. vue项目中 img标签加载图片失败,让其显示默认图片

    <img src="123" @error="defImg" alt="" width="150" > 可以 ...

  10. vue解决图片加载失败显示默认图片的方法

    在项目中经常会遇到图片加载失败需要显示默认图片的场景,那么如何在图片src资源加载失败显示出默认的图片呢? 方法一:onerror <img src="原来要加载的资源" o ...

最新文章

  1. pom.xml中spring-boot-starter-test包的使用
  2. 阿里nacos安装及使用指南
  3. python和java一样吗-Python和Java有什么不一样?
  4. sts (eclipse)安装配置lombok
  5. 使用Popup窗口创建无限级Web页菜单(5)
  6. Ubuntu版本更新一路走来:朕就是这样的汉子
  7. 前端学习笔记之 JavaScript WebAPIs(整理)
  8. 什么是API文档?--斯科特·马文
  9. 数据结构笔记(三十)-- 查找的基本概念和相关的顺序查找
  10. windows安装 wget
  11. 用python画蜡笔小新_用python画的蜡笔小新
  12. Metro风格用户界面设计原则
  13. centos:/usr/bin/perl is needed by mysql-community-server
  14. pandas数据清洗策略1
  15. 3d稀疏卷积——spconv源码剖析(一)
  16. 关于树莓派4B的屏幕输入信号源由HDMI变为AV2的处理方法
  17. 网络综合布线实训室解决方案
  18. Java微服务框架一览
  19. 任岁月变迁,我心不惊
  20. 认识一下CCSA(中国通信标准化协会)

热门文章

  1. VS好用系列之代码片段
  2. mac使用gcc编译器
  3. DeepStream系列之SDK文件夹解析
  4. SpringBoot + Actuator 应用监控
  5. BP神经网络的前世今生
  6. webpack高级应用篇(十四):splitChunks.chunks 中的 async、initial 和 all
  7. The ButterFly Effect蝴蝶效应受币圈热捧
  8. 短信微服务(用户注册)
  9. “深入理解”—选择排序算法
  10. 认真学习套壳技巧-消息队列-日志模块