为了账号安全,请及时绑定邮箱和手机立即绑定

如何显示备用图像,如果找不到源图像?(在的onerror IE而不是在Mozilla工作)

如何显示备用图像,如果找不到源图像?(在的onerror IE而不是在Mozilla工作)

撒科打诨 2019-10-24 15:17:38
如果找不到源图像,则需要在表的单元格中显示替代图像。当前,下面的代码用于执行此操作。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中不起作用。请告诉我一些适用于所有浏览器的解决方案。
查看完整描述

3 回答

?
慕码人8056858

TA贡献1803条经验 获得超6个赞

我觉得这很好,很简短


<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标签中,以使其尝试显示不良图片。


查看完整回答
反对 回复 2019-10-24
?
蛊毒传说

TA贡献1895条经验 获得超3个赞

我已经为我的查询找到了解决方案:


我做了这样的事情:


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; 

    } 

这样,它可以在所有浏览器中工作。


查看完整回答
反对 回复 2019-10-24
?
慕斯709654

TA贡献1840条经验 获得超5个赞

如果您愿意使用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>

////编辑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>


查看完整回答
反对 回复 2019-10-24
  • 3 回答
  • 0 关注
  • 658 浏览
慕课专栏
更多

添加回答

举报

0/150
提交
取消
意见反馈 帮助中心 APP下载
官方微信