如果图片失效,则显示一个默认的图片

图片失效了之后,显示一个红叉叉,实在难看,一般的做法是现实一个默认的图片,比如提示用户“图片已经找不到”等等。

我试了一下,用下面这个可以实现
<img src="111.jpg" onerror="this.src='http://www.iteye.com/images/smiles/icon_biggrin.gif'" /> 


但是每个图片都加上这个显然不合适,那么用js实现。
我这里获取该页的全部图片了,实际操作中只有用户上传的图片才会失效,网站本身的图片一般不会。所以图片dom的时候可以适当限制一下条件,节省不必要的资源浪费。
window.onload = function(){
	var imgs = document.getElementsByTagName("img");
	for(var i=0; i< imgs.length; i++){
		imgs[i].onerror = function(){
			this.src='http://www.baidu.com/img/baidu_logo.gif';
		}
	}
}


-----------------------------------------------

缺点是,如果有失效的链接,能转到默认的图片是不错,但是感觉还是闪了一下(显示红叉叉,然后再加载默认图片),怎么避免呢?

你可能感兴趣的:(JavaScript,html,PHP)