html img不顯示圖片怎麼辦

html img不顯示圖片的解決方法：1、在圖片onload時，再處理圖片；2、在html中新建img實體標籤，程式碼如「」。

本文操作環境：windows7系統、HTML5版，DELL G3電腦

html 載入img圖片不顯示

處理圖片的程式碼在$(document).ready方法中，此方法在html結構載入完成時執行，然而要注意的是，此時圖片並沒有載入完成。因此執行方法體的時候其實是沒有image的，而圖片完全載入的時候方法已經執行完了。

解決方法 1：在圖片onload時再處理圖片。

$(document).ready(function(){
var airportId = getUrlValue("airportId");
if(airportId==null || typeof(airportId) == "undefined"){
return false;
}
data = {
'airportId' : airportId ,
}
Kelp.jsonPost(
"../func/web/getActivityPointsMap",data,function(result){
if(result.re== 1 || result.re == "1" ){
var form = result.data.airportInfoMapForm;
iWidth = form.imageWidth;
iHeight = form.imageHeight;
dWidth = form.width;
imgW = iWidth*imageScale
imgH = iHeight*imageScale;
cellWidth = form.cellWidth * iWidth/dWidth;
var attachId = form.imageAttachId;
}
else{
alert(result.data);
window.history.go(-1);
return false;
}
//使画布大小对应机场图片大小
canvas.width = iWidth+XO;
canvas.height = iHeight+YO;
//创建新的图片对象
var img = new Image();
/* var img = document.getElementById('img'); */
img.src = "<%=request.getContextPath()%>/fileDownload?attachId=" + attachId;
//浏览器加载图片完毕后再绘制图片
img.onload = function(){
var w = XO+ imgW;
var h = YO +imgH;
ctx.drawImage(img,XO,YO,imgW,imgH);//限制图片的宽高，此处没有imgW和imgH则会显示为图片的实际宽高
//画网格线
drawLine();
};   
});
})

上述是在js中新圖。

還有一個方法是：

在html中新建img實體標籤。即：。這樣就不存在不顯示圖片的問題了。

推薦學習：《HTML影片教學》

以上是html img不顯示圖片怎麼辦的詳細內容。更多資訊請關注PHP中文網其他相關文章！