HTML5-简单文件操作
<!DOCTYPE html>
<html>
<head>
<title>简单文件操作</title>
<script type="text/javascript">
function handleFileSelect(evt) {
var files = evt.target.files; // FileList object
// 使用FileReader读取文件
var reader = new FileReader();
reader.onload = (function(theFile) {
return function(e) {
var binaryData = e.target.result;
// 处理读取的文件内容
console.log("文件内容：", binaryData);
};
})(files[0]);
reader.readAsArrayBuffer(files[0]);
}
function handleFileChange(evt) {
// 当文件输入发生变化时调用handleFileSelect函数
handleFileSelect(evt);
}
</script>
</head>
<body>
<input type="file" id="fileInput" multiple onchange="handleFileChange(event)">
</body>
</html>这段代码展示了如何使用HTML5的File API来读取用户选择的文件。当用户选择文件并且文件输入框的内容发生变化时，会触发onchange事件，并调用handleFileSelect函数来处理文件。这里使用了FileReader对象来异步读取文件内容，并在读取完成后通过回调函数输出文件内容。
评论已关闭