温馨提示×

温馨提示×

您好,登录后才能下订单哦!

密码登录×
登录注册×
其他方式登录
点击 登录注册 即表示同意《亿速云用户服务条款》

html中img不显示图片的解决方法

发布时间:2021-06-08 11:13:35 来源:亿速云 阅读:3055 作者:小新 栏目:web开发

这篇文章主要介绍了html中img不显示图片的解决方法,具有一定借鉴价值,感兴趣的朋友可以参考下,希望大家阅读完这篇文章之后大有收获,下面让小编带着大家一起了解一下。

html img不显示图片的解决办法:1、在图片onload时,再对图片进行处理;2、在html中新建img实体标签,代码如“<img id = "img"></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实体标签。即:<img id = "img"></img>。这样就不存在不显示图片的问题了。

感谢你能够认真阅读完这篇文章,希望小编分享的“html中img不显示图片的解决方法”这篇文章对大家有帮助,同时也希望大家多多支持亿速云,关注亿速云行业资讯频道,更多相关知识等着你来学习!

向AI问一下细节

免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。

AI