JS读取本地文本文件(兼容各种浏览器)
html 部分
<input type="file" name="upload" ref="upload" accept=".md" style="display: none" />
1
js 部分
let input = this.$refs.upload;
input.click();
input.onchange = () => {
if (input.files && input.files.length > 0 && input.files[0].size > 0) {
//支持chrome IE10
if (window.FileReader) {
let file = input.files[0];
// let filename = file.name.split(".")[0];
let reader = new FileReader();
reader.onloadend = (evt) => {
// if (evt.target.readyState == FileReader.DONE) {
console.log(evt.target.result);
// this.$emit("on-upload-file", evt.target.result);
// } else {
// console.log("error");
// }
};
// 包含中文内容用gbk编码
reader.readAsText(file, "UTF-8");
}
//支持IE 7 8 9 10
else if (typeof window.ActiveXObject != "undefined") {
let xmlDoc = new ActiveXObject("Microsoft.XMLDOM");
xmlDoc.async = false;
xmlDoc.load(input.value);
console.log(xmlDoc.xml);
// this.$emit("on-upload-file", xmlDoc.xml);
}
//支持FF
else if (document.implementation && document.implementation.createDocument) {
let xmlDoc = document.implementation.createDocument("", "", null);
xmlDoc.async = false;
xmlDoc.load(input.value);
console.log(xmlDoc.xml);
// this.$emit("on-upload-file", xmlDoc.xml);
} else {
// this.$emit("on-upload-file", "该浏览器暂不支持导入文件!");
console.log("error");
}
}
};
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
上次更新: 2024/01/30, 00:35:17
- 02
- Node与GLIBC_2.27不兼容解决方案08-19
- 03
- Git清空本地文件跟踪缓存08-13