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

原文  http://blog.csdn.net/xwq1012/article/details/41941895

参考如下:

http://blog.csdn.net/lejuo/article/details/11528243

前台JS读取本地文件内容,兼容IE7、8、9、10 FF Chrome等各种版本,纠结了好长时间,终于找到方法,希望能帮到你,代码如下。直接复制保存为html运行看效果。

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<script>
function upload(input) {
	//支持chrome IE10
	if (window.FileReader) {
		var file = input.files[0];
		filename = file.name.split(".")[0];
		var reader = new FileReader();
		reader.onload = function() {
			console.log(this.result)
			alert(this.result);
		}
		reader.readAsText(file);
	}
	//支持IE 7 8 9 10
	else if (typeof window.ActiveXObject != 'undefined'){
		var xmlDoc;
		xmlDoc = new ActiveXObject("Microsoft.XMLDOM");
		xmlDoc.async = false;
		xmlDoc.load(input.value);
		alert(xmlDoc.xml);
	}
	//支持FF
	else if (document.implementation && document.implementation.createDocument) {
		var xmlDoc;
		xmlDoc = document.implementation.createDocument("", "", null);
		xmlDoc.async = false;
		xmlDoc.load(input.value);
		alert(xmlDoc.xml);
	} else {
		alert('error');
	}
}
</script>
<title>file upload</title>
</head>
<body>
	<input id='file' type="file" onchange="upload(this)" />【注意,参数传的是这个input的html元素,若是jquery,此参数是$('#file')[0]】
</body>
</html>

前台JS(type=‘file’)读取本地文件的内容,兼容各种浏览器的更多相关文章

  1. 使用JS的 FileReader 读取本地文本文件(可兼容各种浏览器)

    最近需要在客户端操作文件,看到网上有 FileReader 对象,链接:https://developer.mozilla.org/zh-CN/docs/Web/API/FileReader 还是直接 ...

  2. java里如何使用输入流和输出流实现读取本地文件里内容和写出到本地文件里

    不多说,直接上干货! 第一种方法 PWDemo.java package zhouls.bigdata.DataFeatureSelection.filter; import java.io.File ...

  3. 前端用js获取本地文件的内容

    这里要写成input的形式 调用upload函数 传递的参数就表示所选的文件<input type="file" onchange="upload(this)&qu ...

  4. js/jquery 获取本地文件的文件路劲 获取input框中type=‘file’ 中的文件路径(转载)

     原文:http://blog.csdn.net/niyingxunzong/article/details/16989947 js/jquery 获取本地文件的文件路劲 获取input框中type= ...

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

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

  6. H5读取本地文件操作

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

  7. FileReader读取本地文件

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

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

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

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

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

随机推荐

  1. Eexcel批量设定单元格条件格式

    最近在整理excel项目记录,觉得有些技巧还是值得拥有,记录备份下,以防将来使用: [工具/原料] excel(office或wps) [方法/步骤] 1.建立一个追踪表如下: 2.选择状态列,建立数 ...

  2. 【杂记】JavaScript篇

    35.jquery中ifram子窗体调用父窗体方法.父窗体调用子窗体方法 //调用子窗体中的方法. ].contentWindow;//获取子窗体的window对象 childWindow.subFo ...

  3. 移动应用开发过程中需要哪些IOS APP工具

    虽说如今要开发一款IOS app应用软件已经不是什么难事,app开发技术已经发展成熟,所以要制作一款适用于苹果IOS智能操作系统的app软件也挺容易的了.不过对于开发者来说,可以通过一些app工具来更 ...

  4. neXtep 安装过程整理

    1 授权root用户远程登录 2  文件下载 http://www.nextep-softwares.com/ 选择DOWNLOAD NOW 选择你需要的版本 我选择的版本是 neXtep.1.0.7 ...

  5. Leetcode: Line Reflection

    Given n points on a 2D plane, find if there is such a line parallel to y-axis that reflect the given ...

  6. 网络请求出错:The resource could not be loaded because the App Transport

    Google后查证,iOS9引入了新特性App Transport Security (ATS).详情:App Transport Security (ATS) 新特性要求App内访问的网络必须使用H ...

  7. SQL语句增加字段、修改字段、修改类型、修改默认值

    一.修改字段默认值 alter table 表名 drop constraint 约束名字   ------说明:删除表的字段的原有约束 alter table 表名 add constraint 约 ...

  8. 【笔记】js parentsNode,lastChild,appendChild,insertBefore,nextSibling的意义及运用

    这几天看书看到这几个属性做几个笔记 parentNode:顾名思义,就是获取某元素的父元素等同于jq的parent(). *注意一下,在调用parentNode 方法的时候 调用的对象必须是用ID 或 ...

  9. 我认识的log4j开源日志

    Log4j 在java中如何配置log4j!! 步骤: ①引入jar包,推荐新建一个lib文件夹,用来装所有的jar包(还要进行下图内的操作) 之后项目中就会多出一个引入外部Library的项目 ②创 ...

  10. Windows Azure 将正式更名为 Microsoft Azure

    微软的公共云平台在2014年4月3日正式从Windows Azure 更名为Microsoft Azure. windows azure是二级产品名,microsoft azure是一级产品名,和mi ...