文件上传通过ajax传值,通过Ajax方式上传文件(input file),上传到url,使用FormData进行Ajax请求具体代码
时间: 2023-05-20 09:01:29 浏览: 115
可以参考以下代码:
```
// HTML代码
<input type="file" id="fileInput">
<button id="uploadBtn">上传文件</button>
// JavaScript代码
var fileInput = document.getElementById('fileInput');
var uploadBtn = document.getElementById('uploadBtn');
uploadBtn.addEventListener('click', function() {
var file = fileInput.files[0];
var formData = new FormData();
formData.append('file', file);
var xhr = new XMLHttpRequest();
xhr.open('POST', '/upload', true);
xhr.onload = function() {
if (xhr.status === 200) {
console.log('上传成功');
} else {
console.log('上传失败');
}
};
xhr.send(formData);
});
```
其中,`fileInput` 是一个 `<input type="file">` 元素,`uploadBtn` 是一个上传按钮。当用户点击上传按钮时,会触发一个事件处理函数,该函数会获取用户选择的文件,使用 `FormData` 对象创建一个表单数据对象,并将文件添加到表单数据中。然后,使用 `XMLHttpRequest` 对象发送一个 POST 请求,将表单数据发送到服务器。服务器可以通过解析请求体中的表单数据来获取上传的文件。
阅读全文