关于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为 ...
随机推荐
- php gettext
安装gettext: ubuntu: apt-get install php-gettext, apt-get install gettext window:开启扩展 修改locale :$ /u ...
- MGW PCI Framework Architecture
MGW执行SWBT/FT cases是主要是利用Ant项目. Ant的概念 可能有些读者并不连接什么是Ant以及入可使用它,但只要使用通过Linux系统得读者,应该知道make这个命令.当编译Linu ...
- SQL SERVER的锁机制(四)——概述(各种事务隔离级别发生的影响)
六.各种事务隔离级别发生的影响 修改数据的用户会影响同时读取或修改相同数据的其他用户.即这些用户可以并发访问数据.如果数据存储系统没有并发控制,则用户可能会看到以下负面影响: · 未提交的依赖关系(脏 ...
- WPF自定义控件开发实例 - ColorPicker
开发环境:Win10 + VS2017 + .Net4.5 这个 ColorPicker 是<<WPF编程宝典:使用C#2012和.NET4.5>>这本书中的例子.这里我记录一 ...
- Python文件读写及网站显示
一.关于文件读写的笔记 (一) 文件概述 文件是一个存储在辅助存储器上的数据序列,可以包含任何数据内容 文件都是按照2进制进行存储的,但在表现形式上有2种:文本文件和二进制文件. 1. 文本文件 文本 ...
- Linux巩固记录(4) 运行hadoop 2.7.4自带demo程序验证环境
本节主要使用hadoop自带的程序运行demo来确认环境是否正常 1.首先创建一个input.txt文件,里面任意输入些单词,有部分重复单词 2.将input文件拷贝到hdfs 3.执行hadoop程 ...
- POJ 2453
#include <iostream> #include <algorithm> #include <cmath> #define MAXN 1000 #defin ...
- WebForm——JS检测浏览器是否是IE浏览器
function IEVersion() { var userAgent = navigator.userAgent; //取得浏览器的userAgent字符串 && userAgen ...
- odoo开发笔记--与微信集成
odoo 与微信 https://github.com/JoneXiong/oejia_wx
- 【Canal源码分析】配置项
本文讲解canal中的一些配置含义. 一.配置加载图 二.配置文件canal.properties 2.1 common参数定义 比如可以将instance.properties的公用参数,抽取放置到 ...