fileReader对象

版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
本文链接:https://blog.csdn.net/u012841667/article/details/78324384

实现图片预览
属性:
error
onload
readyState
result

方法:
readAsArrayBuffer()
readAsBinaryString()
readAsDataURL()
readAsText()

事件:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>filereader</title>
</head>
<body>
<input type="file" name="file" id="myfile" multiple/>
<img src="" id="myimg" width="200px" height="200px" />
<script type="text/javascript">
    var fileInput = document.getElementById('myfile');
    fileInput.addEventListener("change", function(e){
        var fileReader =  new FileReader();
        fileReader.onload = function(e){
            document.getElementById('myimg').setAttribute('src', e.target.result);
        }
        fileReader.readAsDataURL(e.target.files[0]);
    }, false);

</script>
</body>
</html>
展开阅读全文

没有更多推荐了,返回首页