Js + html5 批量上传txt文件,读取文件内容
<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8" />
<title>Document</title>
<script src="js/jquery.min.js" type="text/javascript" charset="utf-8"></script>
</head>
<body>
<div>
上传文件 ： <input type="file" name="file" multiple id="fileId" />
<button type="submit" name="btn" value="提交" id="btnId" onclick="check()">提交</button>
</div>
<script type="text/javascript">
function check() {
var objFile = document.getElementById("fileId");
if(objFile.value == "") {
alert("不能空")
}
var files = $(\'#fileId\').prop(\'files\'); //获取到文件列表
console.log(files.length);
if(files.length == 0) {
alert(\'请选择文件\');
} else {
for(var i = 0; f = files[i]; i++) {
var reader = new FileReader(); //新建一个FileReader
reader.readAsText(files[i], "UTF-8"); //读取文件
reader.onload = function(evt) {
//读取完文件之后会回来这里
var fileString = evt.target.result; // 读取文件内容
console.log(fileString)
}
}
}
}
</script>
</body>
</html>
js清空input file上传文件的内容
方法一：
JQuery下可以这样写：
$('#fileInput').val('');
javaScript可以这样写：
document.getElementById('fileId').value = '';
方法二：
通过清除form的方法，清除input中的内容
document.getElementById('fileId') && document.getElementById('fileId').reset();