js讀取文本內容，支持csv.txt

時間 2019-11-13

標籤讀取文本內容支持 csv.txt csv txt 欄目 JavaScript 简体版

原文原文鏈接

js讀取文本內容，支持csv.txthtml

<!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等。

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。