HTML img图片加载失败时用默认图片替换

HTML img图片加载失败时用默认图片替换原文地址:http://blog.csdn.net/qq_24771775/article/details/50294931 img元素加载图片失败,则变成一个小图标,让页面变得难看。此时如何替换为默认图片?onerror属性img元素自带onerror属性,加载失败时,触发error事件src=”http://yongqing.is-programmer.com/posts/i

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

原文地址:http://blog.csdn.net/qq_24771775/article/details/50294931

 img元素加载图片失败,则变成一个小图标,让页面变得难看。此时如何替换为默认图片?

onerror属性

img元素自带onerror属性,加载失败时,触发error事件
<img src="http://yongqing.is-programmer.com/posts/image.gif" onerror='this.src="http://yongqing.is-programmer.com/posts/default.gif" />

jquery.error函数

jquery提供对应的事件处理函数
$('img').error(function(){ 
    $(this).attr('src',"default.gif"); })

jquery.one函数

使用上面两种方法,假如默认图片也加载失败,则变成死循环. 此时可使用one()绑定事件
$("img").one("error", function(e){ 
    $(this).attr("src", "default.gif"); });
 
另外error事件,不支持冒泡,jquery.delegate函数捕捉不到error事件。

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

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

赞 (0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • html中div滚动条设置,DIV滚动条属性及样式设置方式「建议收藏」

    html中div滚动条设置,DIV滚动条属性及样式设置方式「建议收藏」这里向大家描述一下DIV滚动条属性及样式设置,所谓DIV滚动条,就是利用DIV标签,在里面嵌入CSS样式表,加入overflow的属性值,这样,当div所规范的区域内的内容达到一定程序时,滚动条就派上用场。DIV滚动条属性及样式设置所谓DIV滚动条,就是利用DIV标签,在里面嵌入CSS样式表,加入overflow的属性值,这样,当div所规范的区域内的内容达到一定程序时,滚动条就派上用场。其功能大…

    2022年7月12日
  • Idea配置热部署「建议收藏」

    Idea配置热部署「建议收藏」Idea配置热部署一、概念热部署就是正在运行状态的应用,修改了他的源码之后,在不重新启动的情况下能够自动把增量内容编译并部署到服务器上,使得修改立即生效。热部署为了解决的问题有两个,一是在开发的时候,修改代码后不需要重启应用就能看到效果,大大提升开发效率;二是生产上运行的程序,可以在不停止运行的情况下进行升级,不影响用户使用。二、Idea开启热部署本篇文章主要是介绍Idea…

    2022年5月22日
  • git指令集

    git指令集Git是分散式的版本控制系統,從架設、簡易操作、設定,此篇主要是整理基本操作、遠端操作等.註:Git的範圍太廣了,把這篇當作是初學入門就好了.:)注意事項由project/.git/config可知:(若有更多,亦可由此得知)origin(remote)是Repository的版本master(branch)是local端,正在修

    2022年5月7日
  • Python基础语法知识点汇集「建议收藏」

    Python基础语法知识点汇集「建议收藏」本文小结了phython基础语法文章目录一.注释二.变量的类型三.标识符和关键字四.输出五.输入六.运算符七.数据类型转换一.注释<1>单行注释以#开头,#右边的所有文字当作说明,而不是真正要执行的程序,起辅助说明作用#我是注释,可以在里写一些功能说明之类的哦print(‘helloworld’)<2>多行注释”’我是多行注…

    2022年6月24日
  • nacicat15 激活码_在线激活

    (nacicat15 激活码)这是一篇idea技术相关文章,由全栈君为大家提供,主要知识点是关于2021JetBrains全家桶永久激活码的内容https://javaforall.net/100143.htmlIntelliJ2021最新激活注册码,破解教程可免费永久激活,亲测有效,上面是详细链接哦~S32PGH0SQB-eyJsaWNlb…

    2022年3月26日
  • endnote参考文献排版_Endnote 导入参考文献的时候,格式错误太多了。是否有什么解决办法?…[通俗易懂]

    我把style的链接放评论区了通常endnote的格式错误有两种:1、参考文献本身存在错误;2、参考文献导入模板不符合GB/T7714第一种好解决,导入的时候从WebOfScience和知网导入即可。第二种比较麻烦,正好我刚写完硕士毕业论文,总结一下(多图预警。。。),只看怎么修改符合GB的参考文献直接看第二部分。答主从本科毕业论文开始就一直使用endnote进行文献管理和参考文献录入,使用过…

    2022年4月14日

发表回复

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

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