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

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


相关推荐

  • 数独口诀_数独技巧xwing推导过程

    数独口诀_数独技巧xwing推导过程数独是一种传统益智游戏,你需要把一个 9×9 的数独补充完整,使得图中每行、每列、每个 3×3 的九宫格内数字 1∼9 均恰好出现一次。请编写一个程序填写数独。输入格式输入包含多组测试用例。每个测试用例占一行,包含 81 个字符,代表数独的 81 个格内数据(顺序总体由上到下,同行由左到右)。每个字符都是一个数字(1−9)或一个 .(表示尚未填充)。您可以假设输入中的每个谜题都只有一个解决方案。文件结尾处为包含单词 end 的单行,表示输入结束。输出格式每个测试用例,输出一行数据,代表填充

    2022年8月9日
    4
  • Eclipse项目环境配置

    【1】环境变量配置安装好Eclipse,jdk后,我们不可避免需要配置如下环境变量。【JAVA_HOME】JAVA_HOME=C:\ProgramFiles\Java\jdk1.8.0_101【CLASSPATH】如果系统中已有该变量属性,只需要添加如下到变量值最前:.;%JAVA_HOME%\lib;%JAVA_HOME%\lib\tools.jar;…

    2022年4月7日
    266
  • jquery选择器用法_jQuery属性选择器

    jquery选择器用法_jQuery属性选择器jQuery的选择器一、基本选择器1.ID选择器ID选择器#id就是利用DOM元素的id属性值来筛选匹配的元素,并以iQuery包装集的形式返回给对象。使用公式:$("#id")示例:$("#box")//获取id属性值为box的元素2.元素选择器…

    2025年6月14日
    5
  • mysql删除约束

    mysql删除约束1、删除notnull约束altertable表名modify列名类型;2、删除unique约束altertable表名dropindex唯一约束名;3、删除primarykey约束altertable表名dropprimarykey;4、删除foreignkey约束altertable表名dropforeignkey外键名;…

    2022年6月24日
    26
  • 如何理解红黑树_位置与方向的初步了解

    如何理解红黑树_位置与方向的初步了解教你透彻了解红黑树 作者:July、saturnman  2010年12月29日本文参考:Google、算法导论、STL源码剖析、计算机程序设计艺术。推荐阅读:Left-LeaningRed-BlackTrees,DagstuhlWorkshoponDataStructures,Wadern,Germany,February,2008.直接下载:http://www.cs

    2022年8月18日
    10
  • linux的vim怎么剪切,Linux.vim.多行复制、删除、剪切

    linux的vim怎么剪切,Linux.vim.多行复制、删除、剪切中间件Study-了解什么是中间件一.中间件含义:中间价是位于各种平台(硬件和操作系统)和各种应用之间的通用服务.帮助应用实现高效的.可靠的消息使应用之间实现便捷的互联互通高效.可靠构建企业应用实现分布式应用的快速搭建和部署注:中间…谈谈我印象中的JVM不足之处研究JVM也有一段时间了,其间也发现了它的很多不足之处,在此一一道来,由于本人对JVM的理解有限,如有错误的地方,还请大家指正:本…

    2022年6月22日
    32

发表回复

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

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