纯JavaScript和HTML5的新特性来实现文件上传
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>File Upload</title>
<script>
function uploadFile() {
const input = document.getElementById('fileInput');
const file = input.files[0];
const formData = new FormData();
formData.append('file', file);
fetch('/upload', {
method: 'POST',
body: formData
})
.then(response => response.json())
.then(data => alert('File uploaded!'))
.catch(error => alert('Error: ' + error));
}
</script>
</head>
<body>
<input type="file" id="fileInput">
<button onclick="uploadFile()">Upload</button>
</body>
</html>这段代码展示了如何使用原生JavaScript和HTML5的fetch API来上传文件。用户通过<input type="file">选择文件，点击按钮后触发uploadFile函数，该函数将文件打包成FormData并通过fetch发送到服务器的/upload路径。服务器需要有相应的处理上传文件的逻辑。
评论已关闭