參考 https://www.jianshu.com/p/51188659d778
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>上傳文件</title>
</head>
<body>
<form enctype="multipart/form-data">
<label>選擇項目: </label>
<select name="allProject" class="allProject"> </select>
<label>文件類型: </label>
<select name="allFileType" class="allFileType"></select>
<input type="file" id="file" name="file" /><br />
<input type="button" value="上傳" class="btn" />
</form>
<script>
//進入頁面加載
$(function () {
allProject()
allFileType()
})
//點擊上傳 按鈕
$(".btn").click(function () {
var formData = new FormData()
var project_id = $(".allProject").val()
var file_type = $(".allFileType").val()
var file = $("#file")[0].files[0]
formData.append("project_id", project_id)
formData.append("file_type", file_type)
formData.append("file", file)
//調取文件上傳接口
upFile(formData)
})
//4. 文件上傳接口
function upFile(formData) {
$.ajax({
url: BaseURL + "/file/upFile",
type: "post",
data: formData,
//上傳文件無需緩存
cache: false,
//用於對data參數進行序列化處理 這里必須false
processData: false,
//必須
contentType: false,
success: function (data) {
console.log(data)
},
})
}
</script>
</body>
</html>