JavaScript-onerror事件:图片加载失败后不显示
HTML:
<img src="http://www.mazey.net/images/upload/image/20170518/1495122198180663.gif" id="img1" onerror="hideImg1();">
<!--下面这个图加载失败但不会出现加载失败的样式-->
<img src="http://www.mazey.net/images/upload/image/20170518/1495120456257031error.png" id="img2" onerror="hideImg2();">
JavaScript:
//加载失败隐藏图片
function hideImg1(){
document.getElementById("img1").style.display="none";
}
function hideImg2(){
document.getElementById("img2").style.display="none";
}
说明:
JavaScript-onerror事件:当图片不存在时或者因为网络原因加载失败,将触发onerror事件。
本例触发onerror事件后将图片样式设为{display:none;}使其消失。
JavaScript-onerror事件:图片加载失败后不显示
JavaScript-onerror事件:图片加载失败后不显示的更多相关文章
- 当h5页面图片加载失败后,给定一个默认图
本文主要讨论页面中图片加载失败后替换默认图片的几种方式 重点来了:一定要记住error事件不冒泡. 相关的知识点:jquery的ready方法.$("img").error().i ...
- 伪元素黑魔法:一个替代onerror解决图片加载失败的方案
问题的引出是这样的,在一个项目中有大量的页面主体是table做数据展示,所以就封装了一个table的组件,提供动态渲染的方案.有个问题是数据类型中有图片,对于图片的加载失败我们需要做容错.一般我们的思 ...
- electron-vue 图片加载失败后使用默认头像
<img :src="item.headUrl" alt="" class="contact-head" :onerror=" ...
- js 图片加载完后的处理事件
//图片加载完成后再显示页面 document.getElementById('icon').onload=function(){ document.getElementById('wrap').st ...
- 当图片加载失败时更换图片, Firefox onerror 报错
当图片加载失败时更换图片. <!DOCTYPE html> <meta charset="UTF-8"> <img src="http:// ...
- js 图片加载失败处理方法
在项目中不可避免会用到图片,尤其是列表,有时候图片会加载失败:这样就会显示一个很难看的坏图片缩略图:下面介绍两种方法,解决这个问题: 1.如果在你的项目中有引入jQuery插件,你可以使用error( ...
- js img图片加载失败,重新加载+断网检查
我们常常会遇到img加载图片的时候因为网络问题或者图片过大导致图片加载失败的问题,页面就因为这张蹦掉的图变得不美观.所以我们需要图片加载失败的时候重新加载图片,前端图片加载优化 //js方法定义 fu ...
- img error 图片加载失败的最佳方案
有时候, 当img的src加载失败, 会显示缺省碎片图片, 影响用户体验. 有一个js事件onerror就派上了用场. 它可以在加载失败时, 显示缺省的图片. 它有两种使用方式. 第一种: 使用纯 ...
- AngularJS中如果ng-src 图片加载失败怎么办
我们知道AngularJS加载图片的方法是用技术分享加ng-src标签,例如: <img ng-src="{{currentUrl}}"/> 其中currentUrl为 ...
随机推荐
- iOSQuart2D绘图之UIImage简单使用
代码地址如下:http://www.demodashi.com/demo/11609.html 人生得意须尽欢,莫使金樽空对月. 天生我材必有用,千金散尽还复来. 前记 说到UIImage大家都不会感 ...
- 基于python实现的DDoS
目录 一个简单的网络僵尸程序 一个简单的DOS攻击程序 整合网络僵尸和DoS攻击--DDoS 代码地址如下:http://www.demodashi.com/demo/12002.html 本例子包含 ...
- python 利用numpy进行数据分析
一.numpy.loadtxt读取数据 data=numpy.loadtxt('数据路径.txt',delimiter=',',usecols=(0,1,2,3) , dtype=float)#读取后 ...
- Azure Storage 分块上传
概述 Azure 存储提供三种类型的 Blob:块 Blob.页 Blob 和追加 Blob.其中,块 Blob 特别适用于存储短的文本或二进制文件,例如文档和媒体文件. 块 Blob 由块组成,每个 ...
- 虚拟机实现https网络设置
现在很多网站使用的都是https协议,想在自己的电脑上实现下, 由于自己的电脑是win10,我总是觉得在windows上布置环境不如在linux上稳定,所以在电脑上安装了虚拟机,cento系统 . 上 ...
- 把sqlserver查询结果复制到Excel出现数据记录遗漏
问题:今天在sqlserver查询,总共有10000记录,把结果复制到Excel,发现少掉352条,用导出csv也是如此. 原因:经排查发现缺少的记录是因为商品名称字段包含英文双引号". 解 ...
- Scrapy系列教程(3)------Spider(爬虫核心,定义链接关系和网页信息抽取)
Spiders Spider类定义了怎样爬取某个(或某些)站点.包含了爬取的动作(比如:是否跟进链接)以及怎样从网页的内容中提取结构化数据(爬取item). 换句话说.Spider就是您定义爬取的动作 ...
- 通过 mklink 命令创建目录链接实现文件转移
C:\WINDOWS\system32>mklink /D "C:\ProgramData\Package Cache" "D:\ProgramData\Packa ...
- codeblocks中右键源文件没有Rename选项?
那是因为你右击的那个文件已经被CB的编辑器打开,关闭即可,你就能看到Rename选项了. 或者更简单,翻到Files那一栏,然后右击某个文件夹选择"Make root"即可,就跟w ...
- JBoss高危漏洞分析
前言 JBoss是一个基于J2EE的开放源代码应用服务器,代码遵循LGPL许可,可以在任何商业应用中免费使用:JBoss也是一个管理EJB的容器和服务器,支持EJB 1.1.EJB 2.0和EJB3规 ...