js 图片加载失败处理方法「建议收藏」

js 图片加载失败处理方法「建议收藏」个人github:https://github.com/qiilee 欢迎follow在项目中不可避免会用到图片,尤其是列表,有时候图片会加载失败;这样就会显示一个很难看的坏图片缩略图;下面介绍两种方法,解决这个问题:1、如果在你的项目中有引入jQuery插件,你可以使用error([[data],fn])这个函数;$("img").error(function(){  //当图…

大家好,又见面了,我是你们的朋友全栈君。

个人github:https://github.com/qiilee  欢迎follow

在项目中不可避免会用到图片,尤其是列表,有时候图片会加载失败;这样就会显示一个很难看的坏图片缩略图;下面介绍两种方法,解决这个问题:

1、如果在你的项目中有引入jQuery插件,你可以使用error([[data],fn])这个函数;

$("img").error(function(){
  //当图片加载失败时,你要进行的操作
  //$(this).attr('src','images/no_pic.jpg');
});

2、如果项目中没有jQuery这样的插件,可以使用HTML的DOM事件onerror事件处理;

复制代码

HTML 中:
  <element onerror="myScript">尝试一下

JavaScript 中:
  object.onerror=function(){myScript};尝试一下

JavaScript 中, 使用 addEventListener() 方法:(注意: Internet Explorer 8 及更早 IE 版本不支持 addEventListener() 方法。)
  object.addEventListener("error", myScript);

支持的 HTML 标签: <img>, <input type="image">, <object>, <script>, <style>
版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。

发布者:全栈程序员-用户IM,转载请注明出处:https://javaforall.cn/136993.html原文链接:https://javaforall.cn

【正版授权,激活自己账号】: Jetbrains全家桶Ide使用,1年售后保障,每天仅需1毛

【官方授权 正版激活】: 官方授权 正版激活 支持Jetbrains家族下所有IDE 使用个人JB账号...

(0)


相关推荐

  • msyql多个or,and,

    msyql多个or,and,

  • 什么是卫语句(卫语句)

    如果条件语句极其复杂,就应该将条件语句拆解开,然后逐个检查,并在条件为真时立刻从函数中返回,这样的单独检查通常被称之为“卫语句”(guardclauses)摘自《重构—改善既有代码的设计》卫语句的效果就是将原来需要仔细阅读代码、细心整理逻辑的条件判断整理成一眼能看透的逻辑关系,效果就像以下:if(it==活的){if(it==人){if(it!=女人){…

  • x201换风扇_x201i拆机风扇清理怎么办【图文】

    x201换风扇_x201i拆机风扇清理怎么办【图文】总所周知,笔记本室友大大小小的配置组装而成的,而笔记本同样的,有时也会存在着或多或少的故障,又或者有时由于好奇心的趋势,让我们相对笔记本内部的相关配置做更深一步的了解,这个时候,我们会选择对笔记本进行拆机,从而对风扇进行清理,但是我们又怕盲目的拆机有可能会对笔记本造成损坏,那么,x201i拆机风扇清理应该怎么办呢?下面,就让我们来认识一下,x201i拆机风扇清理应该怎么办?笔记本散热风扇使用时间长…

  • NDP和LLDP协议

    NDP和LLDP协议NDP和LLDP作用是一样,NDP:用来发现直接相连的邻居信息,包括邻接设备的设备名称、软/硬件版本、连接端口等,另外还可提供设备的id、端口地址、硬件平台等信息LLDP:它提供了一种标准的链路层发现方式,可以将本端设备的的主要能力、管理地址、设备标识、接口标识等信息组织成不同的TLV(Type/Length/Value,类型/长度/值),并封装在LLDPDU(LinkLaye…

  • bfs官网_山谷和山脉

    bfs官网_山谷和山脉FGD小朋友特别喜欢爬山,在爬山的时候他就在研究山峰和山谷。为了能够对旅程有一个安排,他想知道山峰和山谷的数量。给定一个地图,为FGD想要旅行的区域,地图被分为 n×n 的网格,每个格子 (i,j) 的高度 w(i,j) 是给定的。若两个格子有公共顶点,那么它们就是相邻的格子,如与 (i,j) 相邻的格子有(i−1,j−1),(i−1,j),(i−1,j+1),(i,j−1),(i,j+1),(i+1,j−1),(i+1,j),(i+1,j+1)。我们定义一个格子的集合 S 为山峰(山谷)当且仅当:

  • 4g通信系统的网络结构_4g通信

    4g通信系统的网络结构_4g通信1、4G通信网络的关键技术研究4G通信网络,就必须加强对其关键技术的研究,这是决定4G网络通信与3G网络通信不同的关键因素,其主要包括正交频分复用技术、软件无线电技术、智能天线技术、多输入多输出技术、IP核心网技术和多用户检测技术等。1.1正交频分复用技术所谓的正交频分复用技术,简称OFDM技术,是4G通信网络的核心技术,主要是将信道分成若干正交子信道,将高速数据信号转换成并行的低速子数据流,调制到在每个子信道上进行传输。OFDM技术不同于一般性的网络技术,它可以通过相关技术将信号分开,有

发表回复

您的电子邮箱地址不会被公开。

关注全栈程序员社区公众号