我有以下javascript代码来显示图像及其信息。从getImages()方法中,我得到两个API响应数组。第一个数组具有图片网址,第二个数组具有所有者和价格信息。我仅从9个API响应中获取图像URL,其所有者和价格信息。因此,在循环中,对于从API获取9个迭代图像的url,对于其余的图像,我将设置一些默认图像。因此,对于默认图像,没有所有者和价格信息,因此不应为它们显示标题。
window.onload = function () {
var allImages = "";
var owner,price;
var imgurl = getImages();
var imginfo = imgurl[1];
console.log(imginfo);
for (var i = 0, j = 298; i < j; i++) {
if(imgurl[0][i] == undefined){imgurl[0][i]="image/upload.png"}
if(typeof imginfo[i] === "undefined"){owner = ""; price=""; }
else{owner = imginfo[i]["owner"]; price=imginfo[i]["price"];
}
allImages += '<img class="myImg" src='+ imgurl[0][i] +' id='+i+'_id onclick="openpopup(this.src)" title="owner='+owner+', price='+price+'">';
}
$('#photos').append(allImages);
};
有人可以用代码给我一些想法吗?如何给设置图像标题的条件。如果响应未定义,则将title设置为空。
答案 0 :(得分:2)
只需在您的else部分中添加title属性,然后将其从<img>
标记中删除即可。
window.onload = function() {
var allImages = "";
var owner, price;
var imgurl = getImages();
var imginfo = imgurl[1];
console.log(imginfo);
for (var i = 0, j = 298; i < j; i++) {
if (imgurl[0][i] == undefined) {
imgurl[0][i] = "image/upload.png"
}
if (typeof imginfo[i] === "undefined") {
owner = "";
} else {
owner = 'title="owner=' + imginfo[i]["owner"] + ', price=' + imginfo[i]["price"] + '"';
}
allImages += '<img class="myImg" src=' + imgurl[0][i] + ' id=' + i + '_id onclick="openpopup(this.src)" ' + owner + '>';
}
$('#photos').append(allImages);
};
答案 1 :(得分:1)
尝试此操作,如果需要,您也可以使用三元运算符。
window.onload = function () {
var allImages = "";
var owner,price;
var imgurl = getImages();
var imginfo = imgurl[1];
console.log(imginfo);
for (var i = 0, j = 298; i < j; i++) {
var title="";
if(imgurl[0][i] == undefined){imgurl[0][i]="image/upload.png"}
if(!(typeof imginfo[i] === "undefined")){
title="owner="+imginfo[i]["owner"]+", price="+imginfo[i]["price"]+"";
}
allImages += '<img class="myImg" src='+ imgurl[0][i] +' id='+i+'_id onclick="openpopup(this.src)" title="'+title+'">';
}
$('#photos').append(allImages);
};
</script>