Javascript 尝试访问文件时无法读取未定义的属性“target”

我正在尝试将文件上载图像更改为在画布相关脚本中选择或单击同一页面上的图像

function aFileIsLoaded(e1)
{
        var filename = e1.target.files[0];
        var fr = new FileReader();
fr.onload = function(e2)
{
      backgroundimage = new Image();
      backgroundimage.src=e2.target.result;
     var context = document.getElementById('myCanvas').getContext('2d');
     context.canvas.width = backgroundimage.width;
     context.canvas.height = backgroundimage.height;
     context.drawImage(backgroundimage, 0, 0, backgroundimage.width, backgroundimage.height);


};
    fr.readAsDataURL(filename);
}



window.onload=function(){
var s = document.getElementById("fontsize");
s.value="48";
document.getElementById('loadpicture').addEventListener('change', aFileIsLoaded, false);
backgroundimagemode=NONE;
carpeInit();
update();
}

以前，这些图像是这样调用的，文件是从桌面上选择的

<input type="file" name="back" id="loadpicture" src="myimage.png" >

---

如果您正在调用自定义函数，将不胜感激

：

function aFileIsLoaded(e1)
{
        var filename = e1.target.files[0];

此函数要求将文件输入更改事件的事件对象实例作为其第一个也是唯一的参数传递。在onclick处理程序中不传递此参数e1

解决方法是使用DOM查找来查找问题中的元素以读取其文件

 var filename = document.getElementById('loadpicture').files[0]

由于示例缺少HTML代码，因此答案可能不完整

有关活动的更多信息

function aFileIsLoaded(e1)
{
        var filename = e1.target.files[0];

 onclick="aFileIsLoaded()">

 var filename = document.getElementById('loadpicture').files[0]