读取上传文件内容
input 控件上传
<input type="file" name ="fileName" id = "htmlFileId" multiple/>
<button type="button" id="htmlFile" onclick="uploadHTMLFile()">预览文件</button>
核心代码
let reader = new FileReader();
reader.readAsText(files[i], "UTF-8");
reader.onload = function (evt) {
var fileString = evt.target.result;
console.log('fileString')
}
例子
function uploadHTMLFile() {
console.log('uploadHtmlFile');
var objFile = document.getElementById("htmlFileId");
if(objFile.value == "") {
layer.msg('请选择需要上传的HTML文件',{time: 1000});
}else {
console.log(objFile.files[0].size);
var files = $('#htmlFileId').prop('files');
if(files.length == 0){
alert('请选择文件');
}else {
for (let i = 0; i < files.length; i++){
let reader = new FileReader();
reader.readAsText(files[i], "UTF-8");
reader.onload = function (evt) {
var fileString = evt.target.result;
console.log('fileString')
$("#htmlContent").append("<span id=\"htmlFileName\">"+ files[i].name +"</span><textarea id=\"htmlTextArea"+ i +"\" placeholder=\"请输入专题描述\" lay-verify=\"required\" name=\"htmlTextArea"+i+"\" class=\"layui-textarea\" style='margin-bottom: 10px'></textarea>")
$("#htmlTextArea"+ i +"").val(htmlDecodeByRegExp(fileString));
}
}
}
}
}
function htmlDecodeByRegExp(str) {
var temp = "";
if (str.length == 0) return "";
temp = str.replace(/&/g, "&");
temp = temp.replace(/</g, "<");
temp = temp.replace(/>/g, ">");
temp = temp.replace(/ /g, " ");
temp = temp.replace(/'/g, "\'");
temp = temp.replace(/"/g, "\"");
temp = temp.replace(/<brbr\/>/g,"\r\n");
return temp;
}