图片不存在时显示一个默认的图片

img标签src对应的图片不存在,显示一个默认的图片

最简单的方法:

 

 代码如下 复制代码
1 <img src="abc.JPG" onerror="this.src='default.JPG'" />

 

但这个方法有一个弊端,就是当default.jpg也不存在时,网页就会死循环。

 
JS代码:

 代码如下 复制代码

function imgError(obj){
obj.src='/error/images/filmthum_err.gif';
obj.onerror = null;//控制onerror事件只触发一次
}

function imgLoading(obj) {
obj.nextSibling.style.display='none';
obj.style.display='block';
}

HTML代码:

 代码如下 复制代码

<img src="${Image}" onerror="imgError(this);" alt="${imgName}" onload= "imgLoading(this);"/><div> loading... </div>

CSS代码:

 代码如下 复制代码

img {
border: 1px solid #CFCFCF;
overflow: hidden;
height: 141px;
padding: 2px;
width: 115px;
display:none;
}
.imgLoading {
border: 1px solid #CFCFCF;
height: 141px;
overflow: hidden;
padding: 2px;
width: 115px;
background: url('/images/loading.gif') center center no-repeat;
display: block;
}

时间: 2024-09-20 07:38:20

图片不存在时显示一个默认的图片的相关文章

windows列表框控件中能不能显示一个bitmap位图图片

问题描述 windows列表框控件中能不能显示一个bitmap位图图片 windows列表框控件中能不能显示一个bitmap位图图片?列表框怎么显示bitmap图片? 解决方案 参考:http://www.lxway.com/129985101.htm 解决方案二: Using a Virtual CListCtrl to Display Text and Bitmaps http://www.codeproject.com/Articles/35131/Using-a-Virtual-CLis

winform url 显示图片-winform中读取显示URL地址的图片在dgv列表中,并不下载,寻找解决方案

问题描述 winform中读取显示URL地址的图片在dgv列表中,并不下载,寻找解决方案 如果有多张图片就以多列的方式显示图片 解决方案 肯定是要下载的,代码参考http://stackoverflow.com/questions/10759772/how-to-show-image-from-url-in-datagridview-cell

如何让鼠标停在图片按钮上时显示说明的文字?

问题描述 设置什么样子的属性? 解决方案 解决方案二:alt解决方案三:错了alt属性添加到img主要的目的才是为了SEO(搜索引擎优化),搜索引擎不认识图片,但能够通过alt的值对图片内容做出判断.Title是鼠标滑过时显示的文字提示,用户体验上很重要.解决方案四:引用2楼qdwangle的回复: 错了alt属性添加到img主要的目的才是为了SEO(搜索引擎优化),搜索引擎不认识图片,但能够通过alt的值对图片内容做出判断.Title是鼠标滑过时显示的文字提示,用户体验上很重要. 那具体代码如

http://jtrhl.cn-就是想做个类datagrid在绑定到0是显示一个

问题描述 就是想做个类datagrid在绑定到0是显示一个 图片说明 就是想做个类似QQ邮箱的东西,已经有int属性 0,1来保存已读或未读状态,数据用json绑定到datagrid上,怎么让这个datagrid在绑定到0是显示一个图片,绑定绑定1时显示一个图片呢? 解决方案 用formatter

解决js图片加载时出现404的问题_javascript技巧

运营网站久了之后,无法避免会出现图片404的情况,原因可能是图片文件本来就不存在或目前不存在.常见的解决方案是将404图片隐藏或者是替换为默认的图片. img标签事件属性 img标签可使用的时间属性有:onabort, onbeforeunload, onblur, onchange, onclick, oncontextmenu, ondblclick, ondrag, ondragend, ondragenter, ondragleave, ondragover, ondragstart,

图片显示-用asp做一个图片滚动显示时为什么图片不是滚动显示,而是一个一个排列出来的?

问题描述 用asp做一个图片滚动显示时为什么图片不是滚动显示,而是一个一个排列出来的? 就是像那些门户网站上一样,一个图片框里轮流显示几个图片,图片框下边有图片编号比如12345,鼠标移到图片编号上会显示相应的图片,我的部分代码是从别的网页上粘过来的,最后图片不是在一个框里轮流显示而是铺开了显示了,我想知道是哪里的代码有问题..刚接触asp,很多地方不懂啊

Excel中如何设置鼠标经过时显示图片

要实现Excel表格中鼠标指向单元格就出现相关图片的互动效果,只要通过Excel2007的添加图片批注功能就可以轻松做到. 下面,我们以制作产品列表为例,展示具体的添加图片方法. 鼠标指向单元格,自动显示预设图片 单个添加图片 右击目标单元格,选择"添加批注",删除批注输入框中所有文字,接着鼠标移动到批注输入框的边线,当指针变成十字箭头时,单击鼠标右键选择"设置批注格式"→"颜色与线条" →"填充效果"→"图片&qu

让Excel表格鼠标经过时显示图片

有时候,为了制作信息量大又简洁的表格,我们需要为Excel表格的单元格添加可隐藏的图片,并且当鼠标指向单元格,就自动显示图片,移开则不显示,这个鼠触互动效果是不是很酷? 要实现Excel表格中鼠标指向单元格就出现相关图片的互动效果,只要通过Excel 2007的添加图片批注功能就可以轻松做到. 下面,我们以制作产品列表为例,展示具体的添加图片方法. 鼠标指向单元格,自动显示预设图片 单个添加图片 右击目标单元格,选择"添加批注",删除批注输入框中所有文字,接着鼠标移动到批注输入框的边线

html 如何实现鼠标放到图片上时显示小图片和信息(就像csdn 的本网页)

问题描述 如何实现鼠标放到图片上时显示小图片和信息(就像csdn的本网页) 解决方案 解决方案二:<imgsrc="a.jsp"alt="这是一个图片"/>解决方案三:是说书标指向用户头像出现的层么?解决方案四:<imgonmouseover="try{showUserCard(this,'b_sky2012')}catch(ex){};"alt="b_sky2012用户头像"title="b_sk