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

图片加载出错后显示默认图片图片加载出错后展示默认设置的图片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,导致死循环,所以建议使用上面的那种方式

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

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

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

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

(0)


相关推荐

  • centos7下安装mysql5.7(rpm)「建议收藏」

    centos7下安装mysql5.7(rpm)「建议收藏」一查看linux操作系统版本和系统内核版本[root@nfs_client~]#cat/etc/redhat-release查看操作系统版本CentOSLinuxrelease7.5.1804(Core)[root@nfs_client~]#uname-r查看系统内核版本3.10.0-862.el7.x86_64…

  • 104规约使用总结(一)——格式介绍

    104规约使用总结(一)——格式介绍一、格式APDU应用规约数据单元(整个数据)=APCI应用规约控制信息(固定6个字节)+ASDU应用服务数据单元(长度可变)二、固定帧报文1、格式常见帧:启动数据传输激活:680407000000(U帧)启动数据传输确认:68040B000000(U帧)测…

  • TASKLIST命令操作[通俗易懂]

    TASKLIST命令操作[通俗易懂]        Tasklist与Taskkill是xp下很强大的命令工具。之所以强大,并不完全因为我们所熟悉的Taskkill/f/im或是Taskkill/f/pid的用法,而是因为它们的筛选器。我们先来看一下Tasklist与Taskkill的基本语法及使用:  显示运行在本地或远程计算机上的所有任务的应用程序和服务列表,带有过程ID

  • Js的长轮询[通俗易懂]

    Js的长轮询[通俗易懂]长轮询是与服务器保持持久连接的最简单的方式,它不使用任何特定的协议,例如WebSocket或者ServerSentEvent。它很容易实现,在很多场景下也很好用。

    2022年10月15日
  • ip addr del 操作ip时的注意事项[通俗易懂]

    ip addr del 操作ip时的注意事项[通俗易懂]在高可用,多线路及系统维护的特殊情况下,我们通常会通过”ipaddr”这一命令来添加一个隐形IP在相应的设备上,但是当我们在一个设备上添加多个ip的时候,删除某个IP的时候尤其要注意,下面通过几个实例来说明,如下:root@localhost~]#ipaddradd10.1.1.230/24deveth0[root@localhost~]#ipaddradd1…

  • nessus安装使用教程_ps激活成功教程版安装教程

    nessus安装使用教程_ps激活成功教程版安装教程Nessus在Windows版本和Linux版本环境下安装

发表回复

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

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