Javascript 画布图像绘制don'；不能在所有浏览器中工作_Javascript_Html_Canvas

Javascript 画布图像绘制don'；不能在所有浏览器中工作

javascript html canvas

Javascript 画布图像绘制don'；不能在所有浏览器中工作,javascript,html,canvas,Javascript,Html,Canvas,我有一个在画布上绘制图像的简单代码，但它只适用于Firefox 代码如下： <!DOCTYPE html> <html> <head> <title>CANVAS</title> </head> <body> <canvas id="smallImage" width="600" height="600"></canvas> <script> var imgid = docum

我有一个在画布上绘制图像的简单代码，但它只适用于Firefox

代码如下：

<!DOCTYPE html>
<html>
<head>
<title>CANVAS</title>
</head>
<body>
<canvas id="smallImage" width="600" height="600"></canvas>
<script>
var imgid = document.getElementById('smallImage');
var ctx = imgid.getContext('2d');
var img = new Image();
var immmagine = "flowers.jpg";
img.src = immmagine;
ctx.drawImage(img,0,0);
</script>
</body>
</html>


帆布
var imgid=document.getElementById（'smallImage'）；
var ctx=imgid.getContext（'2d'）；
var img=新图像（）；
var immagine=“flowers.jpg”；
img.src=immagine；
ctx.drawImage（img，0,0）；

您需要使用onload事件

img.onload = function() {
   ctx.drawImage(img,0,0);
}

您需要侦听映像上的onload事件：

var imgid = document.getElementById('smallImage');
var ctx = imgid.getContext('2d'); 
var img = new Image();
var immmagine = "flowers.jpg";
img.src = immmagine;
img.onload = function ()
{
 ctx.drawImage(img,0,0);
}

可能在您的ff中，由于测试，图像被缓存。仅在加载映像时绘制，使用onload事件处理程序。检查此项并进行更改。