0
有人可以告訴我哪裏出錯了,當下面的代碼返回上一張上載圖片的值而不是當前圖片時?getImageData返回先前上傳圖片的值不是當前
<canvas id="imageCanvas"></canvas>
<br>
<input type='file' id="imageLoader" name="imageLoader"/>
<br>
任何想法:
var imageLoader = document.getElementById('imageLoader');
imageLoader.addEventListener('change', handleImage, false);
var canvas = document.getElementById('imageCanvas');
var ctx = canvas.getContext('2d');
function handleImage(e){
var reader = new FileReader();
reader.onload = function(event){
var img = new Image();
img.onload = function(){
canvas.width = img.width;
canvas.height = img.height;
ctx.drawImage(img,0,0);
}
img.src = event.target.result;
}
reader.readAsDataURL(e.target.files[0]);
var imageWidth = canvas.width;
var imageHeight = canvas.height;
var imageData = ctx.getImageData(0,0,imageWidth,imageHeight);
var data = imageData.data;
console.log("imageWidth=" +imageWidth);
圖像是通過下面的輸入上傳?
''reader.onload'被異步調用,就像'img.onload' - 哎呀,也沒有看到答案 –
也是,你的代碼是隨機縮進的 –
謝謝,你也是現貨。是的,縮進是相當可怕的,我也需要解決這個問題。 – Micke