将通过<input type="file">上传的txt文件存储在localStorage,提取并构建File对象
参考博文:
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对象的更多相关文章
- JS ajaxfileUpload 一次性上传多个input控件 上传多个文件
本方法适用于一次性上传多个input框输入的文件,如下图所示,任务是需要一次上传两个input框提供的两个文件. 具体方法: 1.修改ajax调用方法 如上图所示,只需要将ajaxFileUpload ...
- Js获取file上传控件的文件路径总结
总结一个获取file上传控件文件路径的方法 firefox由于保护机制只有文件名,不能获取完整路径. document.getElementById('file').onchange = functi ...
- ftp上传或下载文件工具类
FtpTransferUtil.java工具类,向ftp上传或下载文件: package utils; import java.io.File; import java.io.FileOutputSt ...
- input type=file 上传文件样式美化(转载)
input type=file 上传文件样式美化 来源:https://www.jianshu.com/p/6390595e5a36 在做input文本上传时,由于html原生的上传按钮比较丑,需要对 ...
- 判断input[type=file]上传文件格式
input type="file" 在js中判断文件上传类型 function onSubmit(){ var form1 = document.forms[0]; var fil ...
- 使用input=file上传
前台,form的target指向iframe <form action="/EmailHandler.ashx?action=upload" id="form1&q ...
- ajax+ashx 完美实现input file上传文件
1.input file 样式不能满足需求 <input type="file" value="浏览" /> IE8效果图: Firefox效 ...
- 如何用一张图片代替 'input:file' 上传本地文件??
今天去面试,碰到了一道题,也许是因为紧张或者喝水喝多了,一时竟然没有转过弯来,回来之后一细想原来这么简单,哭笑不得,特此记录一下! 原题是这样的: 如何用一张图片代替 'input:file' 上传 ...
- HTML5: input:file上传类型控制
ylbtech-HTML5: input:file上传类型控制 1. 一.input:file 属性返回顶部 一.input:file属性 属性值有以下几个比较常用: accept:表示可以选择的 ...
随机推荐
- 偏前端 - jquery-iframe内触发父窗口自定义事件-
例如父窗口定义了一个事件. top: $(dom1).bind('topEvent', function(){}); 那么iframe里面的元素怎样触发父窗口dom1的事件呢?这样吗? $(dom1, ...
- Devc++编程过程中的一些报错总结
以下都是我在使用Devc++的过程中出现过的错误,通过查找资料解决问题,今天小小地记录.整理一下. 1.[Error] invalid conversion from 'const char*' to ...
- 基于 Keras 用深度学习预测时间序列
目录 基于 Keras 用深度学习预测时间序列 问题描述 多层感知机回归 多层感知机回归结合"窗口法" 改进方向 扩展阅读 本文主要参考了 Jason Brownlee 的博文 T ...
- 20155235 《网络攻防》 实验一 逆向及Bof基础实践说明
20155235 <网络攻防> 实验一 逆向及Bof基础实践说明 实验目的 本次实践的对象是一个名为pwn1的linux可执行文件. 该程序正常执行流程是:main调用foo函数,foo函 ...
- C#调整图片亮度和对比度
BitmapSource bitmap = null; ; ; private void SetBrightness(int degree) { degree = degree * / ; Write ...
- 4513: [Sdoi2016]储能表
4513: [Sdoi2016]储能表 链接 分析: 数位dp. 横坐标和纵坐标一起数位dp,分别记录当前横纵坐标中这一位是否受n或m的限制,在记录一维表示当前是否已经大于k了. 然后需要两个数组记录 ...
- 安装spark-1.5遇到的一些问题
1.java.lang.UnsatisfiedLinkError: org.apache.hadoop.util.NativeCodeLoader.buildSupportsSnappy()Z 这个问 ...
- ipa包兼容性大作战!WeTest iOS深度兼容测试全新升级
2018年,移动端适配话题热闹无比,有iOS新版本新机型发布,全面屏.异形屏.曲面屏争相斗艳,从而产生了各类特殊的屏幕分辨率设备. 正是因为这些特殊分辨率,导致2018年手机设备频繁出现适配问题,如屏 ...
- Python语言简介以及特点
编程语言的分为编译型语言和解释型语言: 1. 编译型语言: (1) 编译型语言的代表:C.C++.Delphi等, (2) 编译型语言的运行方式:编译 -> 运行 (3) 编译型语言的优缺点分析 ...
- MySQL5.7(二)数据库的基本操作
登录MySQL数据库 格式:mysql -u 用户名 -h 主机名或IP地址 -P 端口号 -p 密码