我有这样的锚标签：
<a href=\"http://www.duckbill.com" target=\"_blank\"><img height=\"160\" width=\"160\" src=\"http://images.duckbill.com/PlatypiOnVacation.jpg\" alt=\"Platypi playing Pinochle and eating Pizza in Panama\" /></a>
…有时无法加载src图像;在这种情况下,我想在经过足够的延迟(几秒钟)后,将其替换为：
<a href=\"http://www.duckbill.com" target=\"_blank\"><img height=\"160\" width=\"160\" src=\"Content/Images/PlatypiOnVacation.jpg\" alt=\"Platypi playing Pinochle and eating Pizza in Panama\" /></a>
我知道我可以在jQuery中做到这一点,但是我怎么能够以编程方式确定远程文件没有加载,在这种情况下,使用回退图像进行响应？
UPDATE
我喜欢Brad Christie对真正不可用的图像的回答,但我想永远不要显示“不可用” – 如果目前还没有远程的那个,只需使用本地的.我喜欢这个：http://www.cirkuit.net/projects/jquery/onImagesLoad/example1.html但是如何以编程方式确定图像失败了？
解决方法
<img src="http://remotecdn.com/myimage.jpg"
data-failover="/assets/notfound.jpg" />
然后：
<script>
$('img[data-failover]').error(function(){
var failover = $(this).data('failover');
if (this.src != failover){
this.src = failover;
}
});
</script>
尝试加载实际源,但如果发生错误,请使用故障转移数据属性将其转换为本地资源.由于我们将补充信息分开,因此在不能/不支持它的浏览器中应该优雅地失败.
有关.error()的更多信息.
