【HTML导出word格式,手动实现文件上传,formData包装】
warning:
这篇文章距离上次修改已过205天,其中的内容可能已经有所变动。
<!DOCTYPE html>
<html>
<head>
<title>导出Word</title>
<meta charset="utf-8">
<script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.min.js"></script>
</head>
<body>
<form id="uploadForm">
<input type="file" id="file" name="file" />
<input type="button" value="上传" onclick="uploadFile()" />
</form>
<script>
function uploadFile() {
var formData = new FormData();
var file = document.getElementById('file').files[0];
formData.append('file', file);
$.ajax({
url: '/upload', // 这里改为你的上传接口地址
type: 'POST',
data: formData,
contentType: false,
processData: false,
success: function(response) {
console.log('File successfully uploaded');
// 这里可以根据返回的response进行操作,例如导出Word
window.location.href = '/downloadWord'; // 假设接口返回了Word文件的下载地址
},
error: function(xhr, status, error) {
console.log('An error occurred: ' + status + '\nError: ' + error);
}
});
}
</script>
</body>
</html>
在这个例子中,我们使用了jQuery的$.ajax
方法来实现文件的手动上传,并通过FormData
对象来构建表单数据。上传成功后,可以通过修改window.location.href
来实现Word文件的导出下载。注意,这里的/upload
和/downloadWord
应该替换为你的实际上传和下载Word文件的接口地址。
评论已关闭