我以编程方式将图像添加到我的 html 中。在 Firefox 中，图像加载良好。但是在我测试的所有设备上的 android 中，都不会出现图像。它只是在一个框中显示他们的 alt。
HTML：
<div class="ui-popup-container fade in" id="popupPhoto-popup" tabindex="0">
<div data-role="popup" id="popupPhoto" data-overlay-theme="a" data-theme="d" data-corners="false" class="ui-popup ui-body-d ui-overlay-shadow" aria-disabled="false" data-disabled="false" data-shadow="true" data-transition="none" data-position-to="origin">
<!-- insert images here -->
</div>
</div>
<div class="ui-screen-hidden ui-popup-screen" id="popupCloseRight-screen"></div>
JS：
//shows images upon clicking part in table
function tableSelect(location){
//remove previous images
$("#popupPhoto").text("");
//if image was added or not
var boolean = false;
//splits part names
var part = $("#table"+location).text().split(" ");
//part[0] always empty
for(var i=1;i<part.length;i++){
//so 11 works
if(part[i] == "11"){
part[i]="OO";
}
//runs through every name in imagedir to see if image exists
for(var j=0;j<imagedir.length;j++){
//check if single image
if(part[i] == imagedir[j]){
$("#popupPhoto").append($("<img>", {src: 'images/gradegeoImages/'+part[i]+'.png', "class": 'popphoto', alt: part[i] }));
boolean = true;
break;
//checks if double image
}else if(part[i].concat("1") == imagedir[j]){
$("#popupPhoto").append($("<img>", {src: 'images/gradegeoImages/'+part[i]+'1.png', "class": 'popphoto', alt: part[i].concat("1") }));
$("#popupPhoto").append($("<img>", {src: 'images/gradegeoImages/'+part[i]+'2.png', "class": 'popphoto', alt: part[i].concat("2") }));
boolean = true;
break;
}
}
//if no images, display "No information available"
if(boolean == false){
$("#popupPhoto").append($("<div>", {text: 'No information availabe for '+gradegeo+' of '+part[i]}));
}
}
//show images
$("#popupPhoto").addClass("ui-popup-active");
}