js读取文本内容,支持csv.txt

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
<script>
function upload(input) {
//支持chrome IE10
if (window.FileReader) {
var file = input.files[0];
console.log(file)
filename = file.name.split(".")[0];
var reader = new FileReader();
reader.onload = function() {
$("#text").html(this.result)
}
// reader.readAsText(file,"UTF-8");
reader.readAsText(file,"gb2312");
}
//支持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]】
<div id="text"></div>
</body>
</html>
---------------------------------------------------

fileReader Api

fileReader Api
flieReader 三种状态:
FileReader.readyState:0,1,2 0:empty ,没有文件被load,为空。
1:loading,文件正在被加载。
2:done,读取请求完成。
fileReader事件处理,6种。 onabort:文件读取终端,触发。
onerror:文件遇到错误触发。
onload:文件成功读取触发。
onloadstart:文件开始读取时触发。
onloadend:文件读取结束时触发(无论成功失败)。
onprogress:文件读取中触发。
fileReader读取方法,5种。 FileReader.abort()。中断读取操作,读取状态返回为done,即readyState=2。
FileReader.readAsArrayBuffer()。将文件读取为ArrayBuffer形式。
FileReader.readAsBinaryString() 。将文件读取为二进制字符串(非标准方法,不推荐使用)。
FileReader.readAsDataURL()。读取文件的URL,应用场景,本地预览图片。
FileReader.readAsText()。将文件已文本形式读取。即读取txt等。

  

  

05-11 11:03