代码:

<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. fiddler导出jmx脚本

    1.fiddler版本必须在v4.6.2以上(插件支持的是4.6版本) jmeter版本最好在v3.0以上,版本太低容易导致导出不成功 2.下载fiddler中导出jmx脚本的插件"Jmet ...

  2. Python第三讲

    今日内容概要 数据类型及内置方法 字符编码 文件处理 函数简介 今日内容详细 数据类型及内置方法 列表 name_list =['jason','oscar','tony','kevin'] 1.索引 ...

  3. Java 中线程池的 7 种创建方式!

    在 Java 语言中,并发编程都是通过创建线程池来实现的,而线程池的创建方式也有很多种,每种线程池的创建方式都对应了不同的使用场景,总体来说线程池的创建可以分为以下两类: 通过 ThreadPoolE ...

  4. csrf跨站请求、相关装饰器、auth模块使用

    昨日内容回顾 django操作cookie和session # 作用:就是保存用户信息,保存一系列数据,还可以做缓存 保留一段时间 # session是基于cookie工作的 1. 数据是保存在服务端 ...

  5. 矩池云 | 新冠肺炎防控:肺炎CT检测

    连日来,新型冠状病毒感染的肺炎疫情,牵动的不仅仅是全武汉.全湖北,更是全国人民的心,大家纷纷以自己独特的方式为武汉加油!我们相信坚持下去,终会春暖花开. 今天让我们以简单实用的神经网络模型,来检测肺炎 ...

  6. .Net6 设置环境变量

    开发过程中经常要发布一个版本到测试服上给测试人员测试,可能需要直接输出错误信息,需要设置环境变量为Development,如果是IIS可以通过设置IIS环境变量,见下面这篇文章 https://blo ...

  7. MySQL二进制binlog日志说明以及利用binlog日志恢复数据

    MySQL的binlog日志对于mysql数据库来说是十分重要的.在数据丢失的紧急情况下,我们往往会想到用binlog日志功能进行数据恢复(定时全量备份+binlog日志恢复增量数据部分). 一.关于 ...

  8. python+pytest接口自动化(10)-session会话保持

    在接口测试的过程中,经常会遇到有些接口需要在登录的状态下才能请求,否则会提示请登录,那么怎样解决呢? 上一篇文章我们介绍了Cookie绕过登录,其实这就是保持登录状态的方法之一. 另外一种方式则是通过 ...

  9. Struts2里面有什么隐式对象?

    Struts 2.1 的隐式对象 (这些隐式对象都是Map类型) parameters 用于访问请求参数 request 用于访问HttpServletRequest的属性 session 用于访问H ...

  10. vue Cannot read property ‘tapPromise‘ of undefined

    https://blog.csdn.net/qq379682421/article/details/111574290 https://github.com/SimenB/add-asset-html ...