参考博文:

  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. delphi黑色背景模式

    uses Vcl.Styles, vcl.Themes; procedure TForm1.FormCreate(Sender: TObject); begin TStyleManager.LoadF ...

  2. 达梦数据库DM7小结

    除了很多主流的数据库,我们很熟悉之外,越来越多的国产数据库也涌现出来. 这次就小结一些有关武汉的达梦数据库7这个开发版数据库的有别或者需要注意的地方进行一个简单备注吧. 1.第一件大事就是下载.数据库 ...

  3. mypwd的编译和测试

    pwd指令及其功能 命令格式: pwd [选项] 命令功能: 查看"当前工作目录"的完整路径 常用参数: 一般情况下不带任何参数 如果目录是链接时: 格式:pwd -P 显示出实际 ...

  4. 20155325 2017-2018 1 课上测试、课下作业、实验——码云&博客链接汇总 《信息安全系统设计基础》

    第二周-课上 码云 https://gitee.com/bestiisjava2017/XinXiAnQuanXiTongSheJiJiChu20155325thl/tree/master/0927 ...

  5. WPF 学习笔记-在WPF下创建托盘图标

    原文:WPF 学习笔记-在WPF下创建托盘图标 首先需要在项目中引用System.Windows.Forms,System.Drawing; using System; using System.Co ...

  6. Linux下开发python django程序(django数据库多对多关系)

    1.多对多关系数据访问 models.py设置 from django.db import models # Create your models here. sex_choices=( ('f',' ...

  7. 【bzoj1066】【luogu2472】[SCOI2007]蜥蜴

    1066: [SCOI2007]蜥蜴 Time Limit: 1 Sec  Memory Limit: 162 MB Description 在一个r行c列的网格地图中有一些高度不同的石柱,一些石柱上 ...

  8. 动态加载与插件系统的初步实现(二):AppDomain卸载与代理

    前一篇文章简单展示了类型发现和MEF使用,本文初步进入AppDomain相关内容. CLR程序运行时会创建默认程序集容器即AppDomain,默认AppDomain不支持卸载其程序集,但CLR支持创建 ...

  9. SSM搭项目报错:HTTP Status 400 – Bad Request

    具体报错如下: Type Status Report Description The server cannot or will not process the request due to some ...

  10. Hyperledger Fabric chaincode 开发(疑难解答)

    Q&A Q1: 使用fabric release 1.2 进行golang chaincode开发时报错: ..\..\hyperledger\fabric\vendor\github.com ...