关于web开发中,图片加载失败替换为默认图片
页面上有用户自定义图片的时候经常会出现用户定义的图片特别是站外图片被删除或无法访问,因此,需要判断图片是否能成功被加载,否则自动换成“无法找到图片”之类的系统图片。
document.body.onload = getImg;
function getImg() {
for (var i = 0; i < document.images.length; i++) {
if (document.images[i].readyState != 'complete')
document.images[i].src = "/pc/images/fail.png";
}
}
或者在每张图片的onload对readyState进行判断
关于web开发中,图片加载失败替换为默认图片的更多相关文章
- ionic 图片加载失败,显示默认图片代替
1.首先编写自定义指令 angular.module('starter.directives', []) //当图片找不到事显示替代图片 .directive("errSrc", ...
- vue自定义指令,比onerror更优雅的方式实现当图片加载失败时使用默认图,提供三种方法
首先,来看下效果图(演示一下图片正常加载与加载失败时的效果) 在线体验地址:https://hxkj.vip/demo/vueImgOnerror/ 一.常规方法解决 我们都知道,img标签支持one ...
- Jquery判断页面图片是否加载失败,加载失败则显示默认图片
例子: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3. ...
- vue,onerror实现当图片加载失败时使用默认图
1. 2.
- electron-vue 图片加载失败后使用默认头像
<img :src="item.headUrl" alt="" class="contact-head" :onerror=" ...
- 当h5页面图片加载失败后,给定一个默认图
本文主要讨论页面中图片加载失败后替换默认图片的几种方式 重点来了:一定要记住error事件不冒泡. 相关的知识点:jquery的ready方法.$("img").error().i ...
- WebForm、MVC图片加载失败处理
还是那个该死的WebFrom项目,部分功能替换为MVC后感觉好多了,但是WebForm.MVC都有图片加载失败时显示提示图片的需求,并且统一在js中处理.问题来了,js中图片路径怎么处理呢?现场有可能 ...
- angular 图片加载失败 情况处理? 如何在ionic中加载本地图片 ?
1.angular 图片加载失败 情况处理 在directive中定义组件,在ng-src错误时,调用err-src app.directive('errSrc',function(){ return ...
- AngularJS中如果ng-src 图片加载失败怎么办
我们知道AngularJS加载图片的方法是用技术分享加ng-src标签,例如: <img ng-src="{{currentUrl}}"/> 其中currentUrl为 ...
随机推荐
- 未能加载文件或程序集“System.Web.Http.WebHost, Version=4.0.0.0, ”或它的某一个依赖项。系统找不到指定的文件。
第一次发布MVC项目,打开网站 未能加载文件或程序集“System.Web.Http.WebHost, Version=4.0.0.0, ”或它的某一个依赖项.系统找不到指定的文件. 问题原因:缺少配 ...
- 添加vscode自定义代码块
以vue为例 一.打开vscode>文件>首选项>用户代码片段>vue.json二.编写代码块 其中一行一句:$1是占位符,就是你可以输入的地方."http get& ...
- Python中super()的用法
参考链接:https://www.cnblogs.com/shengulong/p/7892266.html super 是用来解决多重继承问题的,直接用类名调用父类方法在使用单继承的时候没问题,但是 ...
- nginx在Linux下的安装
安装之前的环境装备: 1.ngiinx 是C 语言开发的,我们上传的文件还是源码,需要gcc环境编译源码 : yum install gcc-c++ 2.nginx的http模块使用pcre来解析正则 ...
- mybatis-spring集成:配置多数据库源中遇到的问题
转自:http://www.cfanz.cn/index.php?c=article&a=read&id=71583 mybatis配置多数据源本身很简单,和基本配置差别不大 但是如果 ...
- ubuntu下nodejs源码安装
1.从github选择下载自己要安装的nodejs版本,https://github.com/nodejs/node/releases,我下载的版本是node-9.11.2.tar.gz 2.解压no ...
- Swift5 语言参考(一) 关于语言参考
本系列文章的这一部分描述了Swift编程语言的形式语法.此处描述的语法旨在帮助您更详细地理解语言,而不是允许您直接实现解析器或编译器. Swift语言相对较小,因为Swift代码中几乎无处不在的许多常 ...
- python音乐播放器第二版
此代码是上一期的改版 需要用到的Python库有 .pygame 2.time 3.xmusic(我自己写的用来做音乐索引) .colorama(美观) 推荐使用pip安装 方法: pip ins ...
- joi库 学习笔记
零.背景 node.js 应用中,req.query / req.body 传来的参数需要做 valication( 合法性验证 ) 一.安装 https://github.com/hapijs/jo ...
- java ant 编译打包build.xml完整配置范例
java ant 编译打包build.xml完整配置范例 <?xml version="1.0" encoding="UTF-8" ?> <p ...