在实际上传之前显示图像

时间:2013-08-19 16:38:36

标签: javascript extjs extjs4 extjs4.1

我正在使用filefield将图片上传到我表单上的服务器,并且工作正常。

但是,在用户使用browse按钮将该图像加载到image字段(作为预览类型)之后,我可以立即以某种方式吗?由于我无法访问真正的完整路径,我没有找到办法做到这一点......

修改 感谢Shayan,我设法为此获得了正确的代码:

(在fileupload组件change事件中):

    var file = uploader.fileInputEl.dom.files[0];
    var reader = new FileReader();
    reader.addEventListener('load', function(evt) {
        form.down('#imgLogo').setSrc(evt.target.result);
    });
    reader.readAsDataURL(file);

1 个答案:

答案 0 :(得分:5)

您应该使用FileReader Api并执行它...

    <script>
    var file=new FileReader();
file.readAsDataUrl(fileInput.files[0]);
file.onload=function(evt){
var img=document.getElementById("myimage");
img.src=evt.target.result;
}


    </script>