参考博文:

  JS 之Blob 对象类型

  在本地存储localStorage中保存图片和文件

<input type="file" id="jobData" onchange="loadFile(this.files[0])">

<script>
var filename_1 = localStorage.getItem("filename_1");//存在localStorage中的文件名
var fileresult_1 = localStorage.getItem("fileresult_1");//存在localStorage中的文件内容(string)
//若localStorage已有该项
if(filename_1 && fileresult_1){
//storageFile:通过localStorage中的文件内容和文件名构建的File对象
var storageFile = new File([fileresult_1], {"type":"text/plain"});//File继承自Blob,可以用Blob的构造函数
Object.defineProperty(storageFile,'name',{value:filename_1});
// console.log(storageFile);
} function loadFile(file){
var fileReader = new FileReader();
fileReader.onload = function () {
var result = this.result;//文件内容
//确定,将文件保存到本地存储中,替换现有的
try {
localStorage.setItem("filename_1", file.name);
localStorage.setItem("fileresult_1", result);
}
catch (e) {
console.log("Storage failed: " + e);
}
};
fileReader.readAsText(file);
} </script>

将通过<input type="file">上传的txt文件存储在localStorage,提取并构建File对象的更多相关文章

  1. JS ajaxfileUpload 一次性上传多个input控件 上传多个文件

    本方法适用于一次性上传多个input框输入的文件,如下图所示,任务是需要一次上传两个input框提供的两个文件. 具体方法: 1.修改ajax调用方法 如上图所示,只需要将ajaxFileUpload ...

  2. Js获取file上传控件的文件路径总结

    总结一个获取file上传控件文件路径的方法 firefox由于保护机制只有文件名,不能获取完整路径. document.getElementById('file').onchange = functi ...

  3. ftp上传或下载文件工具类

    FtpTransferUtil.java工具类,向ftp上传或下载文件: package utils; import java.io.File; import java.io.FileOutputSt ...

  4. input type=file 上传文件样式美化(转载)

    input type=file 上传文件样式美化 来源:https://www.jianshu.com/p/6390595e5a36 在做input文本上传时,由于html原生的上传按钮比较丑,需要对 ...

  5. 判断input[type=file]上传文件格式

    input type="file" 在js中判断文件上传类型 function onSubmit(){ var form1 = document.forms[0]; var fil ...

  6. 使用input=file上传

    前台,form的target指向iframe <form action="/EmailHandler.ashx?action=upload" id="form1&q ...

  7. ajax+ashx 完美实现input file上传文件

    1.input file 样式不能满足需求 <input type="file" value="浏览" /> IE8效果图:    Firefox效 ...

  8. 如何用一张图片代替 'input:file' 上传本地文件??

    今天去面试,碰到了一道题,也许是因为紧张或者喝水喝多了,一时竟然没有转过弯来,回来之后一细想原来这么简单,哭笑不得,特此记录一下! 原题是这样的:  如何用一张图片代替 'input:file' 上传 ...

  9. HTML5: input:file上传类型控制

    ylbtech-HTML5: input:file上传类型控制   1. 一.input:file 属性返回顶部 一.input:file属性 属性值有以下几个比较常用: accept:表示可以选择的 ...

随机推荐

  1. a simple game based on RT-Thread

    [作品名称] a simple game based on RT-Thread [背景描述] 学了一段时间的嵌入式操作系统RT-Thread,发现是真的好用.于是想做一个小作品来锻炼巩固自己学习的知识 ...

  2. day 92 跨域和CORS

      跨域和CORS   本节目录 一 跨域 二 CORS 三 xxx 四 xxx 五 xxx 六 xxx 七 xxx 八 xxx 一 跨域 同源策略(Same origin policy)是一种约定, ...

  3. rails 中http请求发生access-control-allow-origin错误

    在api项目中 本地项目无法访问服务器api 百度了下,查出原因 接着找到rails项目的解决方法,安装rack-cors这个gem包 具体方法如下: Gemfile中加入 gem 'rack-cor ...

  4. mybatis第二天——动态SQL与关联查询

    大纲摘要: 1.输入映射和输出映射 a) 输入参数映射 b) 返回值映射 2.动态sql a) If b) Where c) Foreach d) Sql片段 3.关联查询 a) 一对一关联 b) 一 ...

  5. 一个java程序员该具备的工具

    http://itindex.net/detail/37115-java-%E7%A8%8B%E5%BA%8F%E5%91%98-%E5%B7%A5%E5%85%B7 文章很详细.

  6. 日志模块logging介绍

    一.日志的级别 日志一般分为5个级别,分别如下: CRITICAL = 50 #FATAL = CRITICAL ERROR = 40 WARNING = 30 #WARN = WARNING INF ...

  7. cap原则(cap定理)与base理论

    CAP定理c:一致性 Consistency: 分布式系统中,所有数据备份,同一时刻存在一样的值.当在分布式环境中,当一个地方写入返回成功的结果,其他地方也应读取到最新的数据.a:可用性 Availa ...

  8. Print Spooler 服务自动停止

    1)先在服务里停止并禁用Print Spooler : 2)删除此文件夹下的所有文件,C:\Windows\System32\spool\PRINTERS\ : 3)删除注册表 HKEY_LOCAL_ ...

  9. git 自己易忘的命令

    1. git 更新远程分支列表 git remote update origin --prune git remote update origin -p 2. 查看远程分支: git branch - ...

  10. 从零搭建HBase集群

    本文从零开始搭建大数据集群,涉及Linux集群安装搭建,Hadoop集群搭建,HBase集群搭建,Java接口封装,对接Java的C#类库封装 Linux集群搭建与配置 Hadoop集群搭建与配置 H ...