代码:

<input type="file" name="uploadfile" class="J-upload">

<script>
//上传后
var upLoaded = function(evt) {
var fileString = evt.target.result;
console.log(fileString); //文本内容
};
//change事件
var updateUploadFile = function(evt){
var $target = $(evt.target);
var path = $target.val();
var file = path.match(/[^\/\\]+$/gi)[0];
var filterType = 'txt';
var rx = new RegExp('\\.(' + (filterType ? filterType : '') + ')$', 'gi'); //过滤文件
if(file.match(rx) == null){
alert('请上传txt文件');
return;
} var files = evt.target.files; // FileList object
if (files[0]) {
var reader = new FileReader();
reader.readAsText(files[0]);
reader.onload = upLoaded;
}
}; $('.J-upload').bind('change', $.proxy(updateUploadFile, this)); </script>

参考:
W3C File API
通过 File API 使用 JavaScript 读取文件

本文转载于:猿2048→https://www.mk2048.com/blog/blog.php?id=h22ikkc22hj

html 5 读取本地文件API的更多相关文章

  1. H5读取本地文件操作

    H5读取本地文件操作 本文转自:转:http://hushicai.com/2014/03/29/html5-du-qu-ben-di-wen-jian.html感谢大神分享. 常见的语言比如php. ...

  2. .NET 读取本地文件绑定到GridViewRow

    wjgl.aspx.cs: using System; using System.Collections; using System.Configuration; using System.Data; ...

  3. 前台JS(type=‘file’)读取本地文件的内容,兼容各种浏览器

    [自己测了下,能兼容各种浏览器,但是读取中文会出现乱码.自己的解决方法是用notepad++把txt文件编码改为utf-8(应该是和浏览器编码保持一致吧?..)] 原文  http://blog.cs ...

  4. 手工创建tomcat应用,以及实现js读取本地文件内容

    手工创建tomcat应用: 1.在webapps下面新建应用目录文件夹 2.在文件夹下创建或是从其他应用中复制:META-INF,WEB-INF这两个文件夹, 其中META-INF清空里面,WEB-I ...

  5. 【转】flash air中读取本地文件的三种方法

    actionscript中读取本地文件操作有两种代码如下 1.使用File和FileStream两个类,FileStream负责读取数据的所以操作:(同步操作) var stream:FileStre ...

  6. python 读取本地文件批量插入mysql

    Uin_phone.txt 本地文件内容 有1000条,这里只是展示前几条,供参考 133584752 133584759 133584764 133584773 133584775 13358477 ...

  7. FileReader读取本地文件

    FileReader是一种异步读取文件机制,结合input:file可以很方便的读取本地文件. 一.input:type[file] file类型的input会渲染为一个按钮和一段文字.点击按钮可打开 ...

  8. spark读取本地文件

    /** * Read a text file from HDFS, a local file system (available on all nodes), or any * Hadoop-supp ...

  9. QML 读取本地文件内容

    QML 对本地文件的读写 QML 里似乎没有提供直接访问本地文件的模块,但是我们能够自己扩展 QML,给它加上访问本地文件的能力. Qt 官方文档对 QML 是这样介绍的: It defines an ...

随机推荐

  1. WPS:编号

    独立编号 只想用于表示顺序的编号,不想与标题级别挂钩 样式--编号--选择编号种类后--自定义--按照图片设置 要得到类似这样的编号格式 假设 第一章 系统介绍 为 样式 标题二 1.1 监控管理系统 ...

  2. Windows运行(Win+R)快速启动所有程序(自定义)

    运行Win+R我们都会用,等同于开始菜单的"运行".注意,只是效果等同, 从速度来看,按win+r比用鼠标要快很多倍.用win+r启动常用程序 最常用的是输入cmd打开命令行或ca ...

  3. 计算机系统4-> 计组与体系结构1 | 基础概念介绍

    在大二上学期学习数字逻辑的过程中,我对计算机如何运作产生了兴趣,因此开了这个系列来记录自己在这方面的学习过程,此前三篇分别是: 计算机系统->Hello World的一生 | 程序如何运行,从大 ...

  4. LeetCode-268-丢失的数字

    丢失的数字 题目描述:给定一个包含 [0, n] 中 n 个数的数组 nums ,找出 [0, n] 这个范围内没有出现在数组中的那个数. 进阶: 你能否实现线性时间复杂度.仅使用额外常数空间的算法解 ...

  5. JavaScript的事件循环机制浅析

    前言 JavaScript是一门单线程的弱类型语言,但是我们在开发中,经常会遇到一些需要异步或者等待的处理操作. 类似ajax,亦或者ES6中新增的promise操作用于处理一些回调函数等. 概念 在 ...

  6. 面试突击32:为什么创建线程池一定要用ThreadPoolExecutor?

    在 Java 语言中,并发编程都是依靠线程池完成的,而线程池的创建方式又有很多,但从大的分类来说,线程池的创建总共分为两大类:手动方式使用 ThreadPoolExecutor 创建线程池和使用 Ex ...

  7. Rsync未授权访问

    1.漏洞名称 Rsync 未授权访问漏洞 2.漏洞原理 rsync是Linux下一款数据备份工具,支持通过rsync协议.ssh协议进行远程文件传输. 其中rsync协议默认监听873端口,如果目标开 ...

  8. width:auto 和 width:100%有什么区别

    width:auto 和 width:100%有什么区别 宽度计算不同 <div class="parent"> <span class="child& ...

  9. ServletConfig对象和ServletContext对象有什么区别?

    一个Servlet对应有一个ServletConfig对象,可以用来读取初始化参数. 一个webapp对应一个ServletContext对象. ServletContext对象获取初始化定义的参数. ...

  10. 介绍Collection框架的结构?

    随意发挥题,天南海北谁便谈,只要让别觉得你知识渊博,理解透彻即可.