FileReader似乎不起作用

Question

我需要预览通过输入上传的文件。除了未显示上载的图像外，其他一切正常。 我的代码：

// variable val is the file variable which I need to append 
var reader = new FileReader();
reader.onload = function(e) {
    $('#1st').append("<img id='img-1-"+(i+t1)+"' src=''/><div id='upl-1-"+(i+t1)+"'><p>"+val.name
    +"</p><div class='btn btn-danger' style='margin-bottom: 30px' onClick='removeItem1("+(i+t1)+")'>Remove item</div></div>");
    $('#img-1-1').ready = function()
        $('#img-1-1').src = e.target.result;
   }
reader.readAsDataURL(val);

它通过val.name向我显示文件的正确名称，因此文件变量正常。但是为什么它不能显示图像呢？ 在inspect元素中，它显示src =（unknown）。如果我在第一个附件的src中添加一些随机文本，则文本保持不变。来源甚至没有改变。我该怎么解决？