费话少说, 直接上代码
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="./jquery.js"></script>
</head>
<body>
<form>
<input type="file" name="file"/>
<button onclick="upload();">upload</button>
</form>
<script>
function upload () {
console.log('start upload')
let formData = new FormData()
formData.append('file', $(':file')[0].files[0], 'server_side_file_name_key')
formData.append('fileType', 'img')
$.ajax({
url: 'https://your_upload_url',
dataType: 'json',
type: 'POST',
async: false,
data: formData,
processData: false,
contentType: false,
success: function (data) {
console.log('succeed')
if (data.errorCode === '0') {
alert('上传成功! file Id :' + data.data)
}
},
error: function (response) {
console.log('failed')
console.log(response)
}
})
}
})
</script>
</body>
</html>
注意点如下 :
- 对于文件型对象上传,可能用到append的第三个参数, 用于服务端接口文件时的文件名
- jquery 提取文件类型时, 使用 $(':file'), 也就是冒号的方式.
网友评论