如果找不到源图像，我需要在表格的单元格中显示替代图像。目前下面的代码用于这样做。
cell.innerHTML="<img height=40 width=40 src='<%=request.getContextPath()%>/writeImage.htm' onError='ImgErrorVideo(this);'>"
function ImgErrorVideo(source){
source.src = "video.png";
source.onerror = "";
return true;
}
现在的问题是上述解决方案在 Internet Explorer 中有效，但在 mozilla 中无效。
请告诉我一些适用于所有浏览器的解决方案。
我认为这是非常好的和简短的
<img src="imagenotfound.gif" alt="Image not found" onerror="this.src='imagefound.gif';" />
不过要小心。如果 onerror 图像本身产生错误，用户的浏览器将陷入无限循环。
编辑
为避免无限循环，请立即onerror从中删除。
<img src="imagenotfound.gif" alt="Image not found" onerror="this.onerror=null;this.src='imagefound.gif';" />
通过调用this.onerror=null它将删除 onerror 然后尝试获取备用图像。
新 我想添加一个 jQuery 方式，如果这可以帮助任何人。
<script>
$(document).ready(function()
{
$(".backup_picture").on("error", function(){
$(this).attr('src', './images/nopicture.png');
});
});
</script>
<img class='backup_picture' src='./images/nonexistent_image_file.png' />
您只需将 class='backup_picture' 添加到您希望备份图片加载的任何 img 标签中，如果它试图显示不良图像。
我有我的查询的解决方案：
我做过这样的事情：
cell.innerHTML="<img height=40 width=40 alt='' src='<%=request.getContextPath()%>/writeImage.htm?' onerror='onImgError(this);' onLoad='setDefaultImage(this);'>"
function setDefaultImage(source){
var badImg = new Image();
badImg.src = "video.png";
var cpyImg = new Image();
cpyImg.src = source.src;
if(!cpyImg.width)
{
source.src = badImg.src;
}
}
function onImgError(source){
source.src = "video.png";
source.onerror = "";
return true;
}
这样它就可以在所有浏览器中工作。
如果您愿意接受 PHP 解决方案：
<td><img src='<?PHP
$path1 = "path/to/your/image.jpg";
$path2 = "alternate/path/to/another/image.jpg";
echo file_exists($path1) ? $path1 : $path2;
?>' alt='' />
</td>
////EDIT OK，这是一个JS版本：
<table><tr>
<td><img src='' id='myImage' /></td>
</tr></table>
<script type='text/javascript'>
document.getElementById('myImage').src = "newImage.png";
document.getElementById('myImage').onload = function() {
alert("done");
}
document.getElementById('myImage').onerror = function() {
alert("Inserting alternate");
document.getElementById('myImage').src = "alternate.png";
}
</script>