[英]Canvas.drawImage not working
I know this question has been asked lot of times, but i am not able to figure out what am i doing wrong 我知道这个问题已经被问过很多次了,但是我无法弄清楚我在做什么错
var canvas = document.getElementById('myCanvas'); function handleFiles(files) { var preview = document.getElementById('preview'); for (var i = 0; i < files.length; i++) { var file = files[i]; var imageType = /^image\\//; if (!imageType.test(file.type)) { continue; } var img = document.createElement("img"); img.classList.add("obj"); img.src = URL.createObjectURL(file); preview.appendChild(img); // Assuming that "preview" is the div output where the content will be displayed. img.onload = drawImage(img); } } var drawImage = function(img) { var ctx = canvas.getContext("2d"); ctx.drawImage(img, 0, 0); }
<div id="preview"></div> <input type="file" onchange="handleFiles(this.files)"> <canvas id="myCanvas"></canvas>
it should be 它应该是
img.onload = function(){drawImage(img)};
if there is no method argument you can call 如果没有方法参数,则可以调用
img.onload = drawImage;
instead of 代替
img.onload = drawImage()// not correct
syntax is 语法是
x.onload = funcRef;//reference
you should assign a function reference .if you assign drawImage(img)
then return value of drawImage(img)
will be assigned to onload function 。如果您分配应先分配函数引用
drawImage(img)
然后返回的值drawImage(img)
将被分配到为onload功能
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.