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

图片加载出错后显示默认图片图片加载出错后展示默认设置的图片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)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • java线程池参数_java线程池参数设置原则,如何设置线程池参数比较合理?[通俗易懂]

    java线程池参数_java线程池参数设置原则,如何设置线程池参数比较合理?[通俗易懂]线程池的参数应该怎样设置呢?相信对于很多的人来说这也是一个比较难的问题,下面就让我们一起来解决一下,究竟应该如何设置线程池的参数才是最合理的吧!首先在设置参数的时候,有以下的几点是我们需要考虑到的!1、下游系统抗并发的能力多线程给下游系统造成的并发等于你设置的线程数例:假如,是多线程访问数据库,那么就得考虑数据库的连接池大小设置,数据库并发太多影响其qps,会将数据库打挂等问题。假如,是访问下游系…

    2022年5月3日
    46
  • windows MySQL数据库备份bat脚本[通俗易懂]

    windows MySQL数据库备份bat脚本[通俗易懂]在windows服务器上,想要定时备份数据库数据,可采用windows的任务计划程序+数据库备份脚本组合。其中,MySQL数据库备份,起到关键作用是mysqldump。有关于mysqldump命令的用法,可以找MySQL的官方文档了解。以下主要描述脚本:echo设置MySql数据库的连接信息sethost=127.0.0.1setusername=rootsetpassword…

    2022年6月2日
    123
  • Ubuntu 15.10 安装 Rabbitvcs

    Ubuntu 15.10 安装 Rabbitvcsppa按回车继续或者Ctrl+c取消添加gpg:钥匙环‘/tmp/tmp_70d0zm5/secring.gpg’已建立gpg:钥匙环‘/tmp/tmp_70d0zm5/pubring.gpg’已建立gpg:下载密钥‘34EF4A35’,从hkp服务器keyserver.ubuntu.comgpg:/tmp/tmp_70d0zm5/trustdb.gpg:建立了信任度数据库gpg:密钥34EF4A35:公钥“LaunchpadRabbitVCS”已导入gpg:合计被处理的数量:1g

    2022年7月18日
    11
  • 电脑爱好者必须懂得的电脑简单英语单词[通俗易懂]

    电脑爱好者必须懂得的电脑简单英语单词[通俗易懂]使用电脑必懂的53个英文单词和缩写!  ·PC:个人计算机PersonalComputer  ·CPU:中央处理器CentralProcessingUnit  ·CPUFan:中央处理器的“散热器”(Fan)  ·MB:主机板MotherBoard  ·RAM:内存RandomAccessMemory,以PC-代号划分规格,如PC-133,PC-1066,PC-27…

    2022年6月3日
    35
  • 遍历ArrayList,并删除某些元素的方法实现「建议收藏」

    遍历ArrayList,并删除某些元素的方法实现「建议收藏」本文是根据https://blog.csdn.net/qq_32575047/article/details/78902254的帖子进行整理的,在此感谢一下。题目:一个ArrayList对象aList中存有若干个字符串元素,现欲遍历该ArrayList对象,删除其中所有值为”abc”的字符串元素,请用代码实现。publicclassTest1{public…

    2022年9月30日
    0
  • springboot mybatis项目搭建_idea配置javaweb开发环境

    springboot mybatis项目搭建_idea配置javaweb开发环境利用IDEA搭建SpringBoot项目,整合mybatis,实现简单的登录功能。利用闲余时间想自己搭建一个springboot+mybatis的项目,提升一下自己对项目的了解,毕竟自己还是一个小白,在这里为自己创建项目的过程做一个记录,以便以后回忆。同时将搭建中遇到的问题也在这里做记录。如有遇到同样问题的同学,希望能给你一下借鉴。springboot的优势之一…

    2022年9月12日
    1

发表回复

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

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