图片加载失败后显示默认图片

图片加载失败后显示默认图片加载失败后显示默认图:<img:src=”`${img}.png`”onerror=”javascript:this.src=’logo.png'”/>也可以在图片加载失败后弹出提示:<imgsrc=”image.gif”onerror=”alert(‘图片不能被加载。’)”>扩展小知:img除了支持加载失败的回调,也支持加载中断及加载成功的回调。用法:onabort:<imgsrc=”image_w3default.gif”onabort

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

加载失败后显示默认图:

<img :src="`${ 
     img}.png`" onerror="javascript:this.src='logo.png'"/>

也可以在图片加载失败后弹出提示:

<img src="image.gif" onerror="alert('图片不能被加载。')">

扩展小知:
img除了支持加载失败的回调,也支持加载中断及加载成功的回调。
在这里插入图片描述

用法

onabort:

<img src="image_w3default.gif" onabort="abortImage()">

function abortImage(){ 
   
    alert('Error: 图像加载终止!')
}

onload:

<img src="w3javascript.gif" onload="loadImage()">

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

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

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

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

(0)
blank

相关推荐

  • 创建和调用动态链接库方法

    创建和调用动态链接库方法

  • 批量修改文件后缀名「建议收藏」

    批量修改文件后缀名「建议收藏」在该文件夹下新建一个txt文件,输入:ren*原后缀名*新后缀名保存,将此txt文件的后缀改为.bat,双击运行,ok。说明:ren是rename(重命名)的缩写。第一个参数指定要匹配

  • sql根据字段去重_sql如何去重查询

    sql根据字段去重_sql如何去重查询关于sql去重,我简单谈一下自己的简介,如果各位有建议或有不明白的欢迎多多指出。关于sql去重最常见的有两种方式:DISTINCT和ROW_NUMBER(),当然了ROW_NUMBER()除了去重还有很多其他比较重要的功能,一会我给大家简单说说我自己在实际中用到的。假如有张UserInfo表,如下图:现在我们要去掉完全重复的数据:SELECTDISTINCT*FROMdbo.UserInf…

  • 3DCNN

    3DCNN学习论文Appearance-and-RelationNetworksforVideoClassification的时候看到了3DCNN,因为是第一次接触视频分类,因此,查询学习转自:https://blog.csdn.net/zouxy09/article/details/9002508最近看DeepLearning的论文,看到这篇论文:3DConvolutionalNeural…

  • Lunix操作「建议收藏」

    Lunix操作「建议收藏」pwd当前目录ls显示文件ls-a显示所有文件wenjianls-a~显示所有隐藏文件权限 用户所有者 文件大小 修改时间戳  文件名如果 test不存在使用 -p删除文件夹下所有文件和子目录删除一个目录-i带有交互的询问通配符匹配…

  • Eclipse 的中文简体版安装教程「建议收藏」

    Eclipse的中文简体版安装教程进行这个教程之前,请先完成JDK的安装。关于JDK的安装,请见笔者的另一博客:JDK的安装:https://blog.csdn.net/wangpaiblog/article/details/111466827下面开始介绍安装文件从网上获取的途径。进入Eclipse官网,下载免安装版。因为是国外的网站,所以可能网站加载缓慢。部分浏览器可能禁用此网站上的某些控件,所以如下的过程如果发现网站上缺失某些界面选项,可以试试换个浏览器。(网址:https://www.

发表回复

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

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