FileReader.result

该属性返回文件的内容。此属性仅在读取操作完成后才有效,并且数据的格式取决于用于启动读取操作的方法。FileReader]**result**

句法

var file = instanceOfFileReader .result

值

适当的字符串或ArrayBuffer]基于哪种读取方法来启动读取操作。该值是null读数是否尚未完成或未成功。

结果类型如下所述。

方法 描述
readAsArrayBuffer() 的result是JavaScript ArrayBuffer包含的二进制数据。
readAsBinaryString() 该result包含在一个字符串的文件的原始的二进制数据。
readAsDataURL() 该result是一个字符串data:表示文件的传输数据的URL。
readAsText() 该result是一个字符串文本。

例

此示例展示了一个函数,read()该函数从file input读取文件。它的工作方式是创建一个FileReader对象并为加载事件创建一个侦听器,以便在读取文件时result获取并将其传递给提供给的回调函数read()。

内容作为原始文本数据处理。

var fileInput = document.querySelector('input[type="file"]');

function read(callback) {
var file = fileInput.files.item(0);
var reader = new FileReader(); reader.onload = function() {
callback(reader.result);
} reader.readAsText(file);
}

FileReader.result的更多相关文章

  1. Web API接口之FileReader

    Web API接口之FileReader *:first-child { margin-top: 0 !important; } body>*:last-child { margin-botto ...

  2. H5 新特性之 fileReader 实现本地图片视频资源的预览

    大家好 !!  又见面了, 今天我们来搞一搞   H5的新增API    FileReader     真是一个超级超级方便的API呢!!!很多场景都可以使用.......... 我们先不赘述MDN文 ...

  3. js文件上传原理(form表单 ,FormData + XHR2 + FileReader + canvas)

    目录 form表单上传 FormData + XHR2 + FileReader + canvas 无刷新本地预览压缩上传实例 目前实现上传的方式 浏览器小于等于IE9(低版本浏览器)使用下面的方式实 ...

  4. 富文本编辑器&FileReader

    最近在做一个web版的管理Tool,其中包括一个编辑框,要求能够编辑文字,插入图片,最后导出做成一个Html.对于资深人士看来,这很容易啊,不就是一个富文本编辑框吗?这其实就是一个概念的问题,对有经验 ...

  5. FileReader 方法 实现预览图片

    FileReader 方法 方法名 参数 描述 abort none 中断读取 readAsBinaryString file(blob) 将文件读取为二进制码 readAsDataURL file( ...

  6. FileReader生成图片dataurl的分析

    目录 相关代码及html(来源:百度百科) File API及FileReader简介 结合补充知识进行代码分析 修改尝试: 拖曳图片到网页完成转换 相关代码及html(来源:百度百科) <!D ...

  7. JavaScript FormData对象,FileReader对象,files属性

    一.ajax与FormData的使用 最近在使用ajax朝后端提交数据时,如果提交的数据都是普通键值对还好说,直接使用ajax默认的格式向后端提交即可. $('#d1').click(function ...

  8. FileReader()读取文件、图片上传预览

    前言 FileReader 对象允许Web应用程序异步读取存储在用户计算机上的文件(或原始数据缓冲区)的内容,使用 File 或 Blob 对象指定要读取的文件或数据. 其中File对象可以是来自用户 ...

  9. 【报错解决】Uncaught TypeError: Failed to execute 'readAsDataURL' on 'FileReader': parameter 1 is not of type 'Blob'.

    项目开发日记-bug多多篇(2) 同时也是 实现一些功能(3) 真的痛苦,写一天代码遇到的bug够我写三天博客. 今天是为了做一个头像功能,具体说是用户上传头像文件并且预览的功能. <div c ...

随机推荐

  1. Linux 如何创建或删除以横杠(-)开头的文件或目录

    小测试: [root@test test]# ls [root@test test]# touch -abc touch: invalid option -- 'b' Try `touch --hel ...

  2. T3hack大部分随机化数据

    1000 2000 1 2 1269 1 3 7707 1 4 3329 4 5 6789 1 6 6691 3 7 -1 1 8 2037 6 9 5427 6 10 5690 4 11 4847 ...

  3. AutoCad 二次开发 .net 之创建Table

    我使用了COM对象来在cad2018中创建table表格,需要的ObjectArx开发包可以在官网上下载,并且需要使用.netframework4.6的库才行. 项目里除了引用常规的Cad开发dll, ...

  4. 使用vue-cookies操作cookie

    1.前言 在vue中如果想要操作cookie,除了使用之前我们自己封装好的操作cookie的方法之外,我们还可以使用vue-cookies插件,这是一个简单的Vue.js插件,专门用于在vue中处理浏 ...

  5. JSP——九大隐藏对象之四大域对象

    你一定在你的Jsp文件中的监本片段中使用过以下九个对象的几种:out.config.page.pageContext.exception.request.response.application.se ...

  6. [转载]1.1 UiPath下载安装与激活

    一.UiPath下载 1.打开官网https://www.uipath.com.cn,点击开始试用 2.选择获取UiPath社区版 3.填写姓.名.电子邮箱地址.专业领域.职位.公司.公司所在行业.国 ...

  7. ORACLE存储过程的创建和执行的简单示例和一些注意点

    此示例的主要目的主要是为了了解在PL/SQL环境下怎么创建和执行存储过程. 存储过程所涉及的DataTable: 第一步:创建游标变量 游标是ORACLE系统在内存中开辟的一个工作区,主要用来存储SE ...

  8. 映客直播软开校招岗(go语言)

    问题: 笔试: 比较简单,有一道题比较深刻: 内存1G,需要计算1G的数据排序,哪种排序方法效率最低,当时选的是冒泡,因为涉及到频繁的数据交换,其实应该是归并,因为归并不是原地排序,多占用的内存空间, ...

  9. linux中dd相关命令骚操作

    一.dd如何快速将磁盘写满 方法一: dd if=/dev/zero of=/tmp/file bs=1G count=10 # 参数解释 1. if=文件名:输入文件名,缺省为标准输入.即指定源文件 ...

  10. css字体图标的制作

    我介绍的这个办法是直接在 "阿里巴巴图标库"中制作的,方便快捷 1. 首先到 "阿里巴巴图标库"中找到你想要的图片,然后选择加入购物车 接着我们点击右上角的购物 ...