HTML5 Canvas drawImage不显示
代码如下，浏览器已升级，但是图片加载始终不成功．．<htmlxmlns="http://www.w3.org/1999/xhtml"><head><metahttp-eq...
代码如下，浏览器已升级，但是图片加载始终不成功．．
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style>
#canvas{margin:10px; padding:10px; border: thin inset #939}
</style>
<script type="text/javascript" src="jquery-1.11.1.js"></script>
</head>
<body>
<canvas id='canvas' width='600' height='300'>
Canvas not supported
</canvas>
<script type="text/javascript">
var canvas=document.getElementById("canvas"),
context=canvas.getContext("2d"),
image=new Image();
image.src="4.png";
image.onload=function(){
context.drawImage(image,0, 0);
};
</script>
</body>
</html> 展开
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style>
#canvas{margin:10px; padding:10px; border: thin inset #939}
</style>
<script type="text/javascript" src="jquery-1.11.1.js"></script>
</head>
<body>
<canvas id='canvas' width='600' height='300'>
Canvas not supported
</canvas>
<script type="text/javascript">
var canvas=document.getElementById("canvas"),
context=canvas.getContext("2d"),
image=new Image();
image.src="4.png";
image.onload=function(){
context.drawImage(image,0, 0);
};
</script>
</body>
</html> 展开
2个回答
展开全部
你的脚本是放在<script>标签中的吗？另外ctx=c.get.Context("2d");多了个点，应该是ctx=c.getContext("2d");
使用如下代码绘图没有问题：
<img id="A" src="A.jpg" alt="A" width="300" height="300" /><br />canvas画板<br /><canvas id="canvas_A" width="500" height="350" style="border:1px solid black;">你的浏览器不支持html5</canvas><script>var c,ctx,img;c=document.getElementById("canvas_A");ctx=c.getContext("2d");img=document.getElementById("A");ctx.drawImage(img,10,10);</script>
这样可以么？
使用如下代码绘图没有问题：
<img id="A" src="A.jpg" alt="A" width="300" height="300" /><br />canvas画板<br /><canvas id="canvas_A" width="500" height="350" style="border:1px solid black;">你的浏览器不支持html5</canvas><script>var c,ctx,img;c=document.getElementById("canvas_A");ctx=c.getContext("2d");img=document.getElementById("A");ctx.drawImage(img,10,10);</script>
这样可以么？
本回答被网友采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
