starrfyrre
New Member
I'm recently making a program that can let users upload their portrait. So i use the file input and rewrite the onchange function. In the onchange function I new a image object and when the image object is ready I use the width and height and src of the image to set the fitted width and height of an img. The codes belows works well in chrome but failed in ie10. The addEventListener and attachEvent both failed in ie10. I just want the img to deal with the onload event. How can I do that? \[code\]function setImage(file){var tempImg = document.createElement('img');tempImg.addEventListener('load', function(){ alert('success'); var isExist = false; var imgDiv = document.getElementsByClassName('img-border')[0]; if (document.getElementsByClassName('photo-canvas').length == 1){ var canvas = document.getElementsByClassName('photo-canvas')[0]; isExist = true; } else{ var canvas = document.createElement('canvas'); } var xTimes = tempImg.width / portraitWidth; var yTimes = tempImg.height / portraitWidth; var realTimes = xTimes > yTimes ? xTimes : yTimes; realWidth = tempImg.width / realTimes; realHeight = tempImg.height / realTimes; centerX = realWidth / 2; centerY = realHeight / 2; var realImg = document.getElementsByClassName('temp-photo')[0]; realImg.style.width = realWidth + 'px'; realImg.style.height = realHeight + 'px'; realImg.style.marginLeft = -realWidth / 2 + 'px'; realImg.style.marginTop = -realHeight / 2 + 'px'; realImg.src = http://stackoverflow.com/questions/14544663/null; realImg.src = tempImg.src; canvas.width = realWidth; canvas.height = realHeight; canvas.style.marginLeft = -realWidth / 2 +'px'; canvas.style.marginTop = -realHeight / 2 + 'px'; if (!isExist){ canvas.onload = function(){ draw(this); } imgDiv.appendChild(canvas); } else draw(canvas); }, false); if (document.all){ tempImg.src = http://stackoverflow.com/questions/14544663/file.value; var temp = document.getElementsByClassName('temp-photo')[0]; temp.src = http://stackoverflow.com/questions/14544663/file.value;}else{ var image = file.files.item(0); if (typeof(image.getAsDataURL) !='undefined') tempImg.src = http://stackoverflow.com/questions/14544663/image.getAsDataURL(); else tempImg.src = window.webkitURL.createObjectURL(image);} \[/code\]}