图片加载出错后显示默认图片

图片加载出错后显示默认图片图片加载出错后展示默认设置的图片img因网络问题以及其他问题加载出错时,展示成下图的样式网络出错时,没有设置默认图片显示成这样使用one()绑定事件是防止默认图片也加载不出,防止死循环$(“.listList2”).one(“error”,function(e){$(this).attr(“src”,”image/head_portrait.png”);});或者img元素自带onerror属性,加载失败时,触发error事件<imgsrc=”img/yuan.

大家好,又见面了,我是你们的朋友全栈君。如果您正在找激活码,请点击查看最新教程,关注关注公众号 “全栈程序员社区” 获取激活教程,可能之前旧版本教程已经失效.最新Idea2022.1教程亲测有效,一键激活。

Jetbrains全系列IDE使用 1年只要46元 售后保障 童叟无欺

图片加载出错后展示默认设置的图片

img因网络问题以及其他问题加载出错时,展示成下图的样式
加载出错后显示默认图片
网络出错时,没有设置默认图片显示成这样
加载出错时,图片显示成这样

使用one()绑定事件是防止默认图片也加载不出,防止死循环

$(".listList2").one("error", function(e){
    $(this).attr("src", "image/head_portrait.png");
});

或者

img元素自带onerror属性,加载失败时,触发error事件

<img src="img/yuan.png" οnerrοr="javascript:this.src='img/xian.png';">

图片存在则显示yuan.png,图片不存在或者因网络原因将显示 xian.png
若 xian.png 也不存在,则继续触发 onerror,导致死循环,所以建议使用上面的那种方式

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/158927.html原文链接:https://javaforall.net

(0)
上一篇 2022年7月26日 下午3:16
下一篇 2022年7月26日 下午3:16


相关推荐

  • Pandas详解十之Dropna滤除缺失数据

    Pandas详解十之Dropna滤除缺失数据约定 importpandas 滤除缺失数据 pandas 的设计目标之一就是使得处理缺失数据的任务更加轻松些 pandas 使用 NaN 作为缺失数据的标记 使用 dropna 使得滤除缺失数据更加得心应手 一 处理 Series 对象通过 dropna

    2026年3月18日
    3
  • Decorator 单一职责模式[通俗易懂]

    Decorator 单一职责模式[通俗易懂]单一职责模式动机模式定义案例结构要点总结笔记动机在某些情况下我们可能会“过度地使用继承来扩展对象的功能”,由于继承为类型引入的静态特质,使得这种扩展方式缺乏灵活性;并且随着子类的增多(扩展功能的增多),各种子类的组合(扩展功能的组合)会导致更多的子类的膨胀如何使“对象功能的扩展”能够根据需要来动态实现?同时避免”扩展功能的增多“带来的子类膨胀问题?从而使得任何任何”功能扩展变化“所导致的影响将为最低?模式定义动态(组合)地给一个对象增加一些额外的职责。就增加功能而言Decorator模式比生成子类

    2022年8月9日
    5
  • BHO编写

    BHO编写首先谈 BHO 的开发工具 我偏向使用 VC unmanagedC 作为开发工具 因为 JavaJVM 或 NetCLR 的虚拟机是个很笨重的东西 也是内存杀手 并不具备写 plugin 的快捷轻巧的特点 个人并不喜欢将其作为 Plug in 的开发平台 不过我会有另文说明用 C 开发 BHO 的全过程 作为那些偏重开发效率的同学的参考 其次是类库的选择 我倾向利用 活动模

    2026年3月18日
    2
  • marquee标签详解

    marquee标签详解marquee 标签详解

    2026年3月18日
    2
  • 因果图方法_因果图法符号

    因果图方法_因果图法符号因果图方法  一.方法简介  1.定义:是一种利用图解法分析输入的各种组合情况,从而设计测试用例的方法,它适合于检查程序输入条件的各种组合情况。  2.因果图法产生的背景:  等价类划分法和边界值分析方法都是着重考虑输入条件,但没有考虑输入条件的各种组合、输入条件之间的相互制约关系。这样虽然各种输入条件可能出错的情况已经测试到了,但多个输入条件组合起来可能出错的情况却被忽视了。

    2022年8月14日
    4
  • unity打开相册选择图片_unity源文件怎么打开

    unity打开相册选择图片_unity源文件怎么打开最近做项目需要用到这个功能,就是在Unity中调用Android本地相册或直接打开摄像机拍照并且裁剪一部分用于用户头像,今天研究了一下,那么研究出成果了MOMO一定要分享给大家。Unity与Android的交互还有谁不会??如果有不会的朋友请看MOMO之前的文章喔,Unity3D研究院之打开Activity与调用JAVA代码传递参数(十八)这里有关交互的方式就不详细说明,主要将如何在Unity中

    2026年2月16日
    5

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

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