Question

在我的chrome扩展程序中，我想在弹出窗口中查看图像和文本

一切正常，但如果图像src的json数据为空，则无法设置默认图像。我已经尝试过堆栈溢出的mane替代解决方案但是dint帮助。 因此请不要复制或将其与其他解决方案一起提交。

这是我的popup.html

   <img id="img" />

这是我的popup.js

var image = document.getElementById('img');

var jsonData = JSON.parse(myData);
image.src = jsonData["details"].imageUrl;

我正在使用ajax post请求从服务器端获取数据。我在成功部分添加了这段代码。

问题：wehn image src为空我需要在我的ajax调用中设置一个默认值。我尝试了15种不同的尝试之一：

fixBrokenImages = function( url ){
var img = document.getElementsByTagName('img');
var i=0, l=orgLogox.length;
for(i=0;i<orgLogox.length;i++){
    var t = orgLogox[i];
    if(t.naturalWidth === 0){
       //this image is broken
         t.src = url;
     }
   }
}

Answer 1

您可以在将图片网址设置为img标记之前检查图片网址。

var jsonData = JSON.parse(myData);
var url = jsonData["details"].imageUrl;
if(!url || url == ""){
    image.src = "default.png"
}else{
    image.src = url;
}

Answer 2

解决方案：我这样解决了

image.onerror = function () {
this.src = 'default.png';
};
image.src = jsonData["details"].imageUrl;

从此链接获得帮助：

Test to see if an image with json value is broken/ or not there and replace with "no-photo" image?

如果JSON响应上的图像src为空，则如何设置默认本地图像

2 个答案: