Ajax實(shí)現(xiàn)文件上傳功能(Spring MVC)
本文實(shí)例為大家分享了Ajax實(shí)現(xiàn)文件上傳的具體代碼,供大家參考,具體內(nèi)容如下
前端表單 和 JQuery jsp/html代碼
使用JQury
<script src="static/js/jquery-3.4.1.js"></script>
前端表單
<form id="form-avatar" enctype="multipart/form-data"> <p>請(qǐng)選擇要上傳的文件:</p> <p><input type="file" name="file" /></p> <p><input id="btn-avatar" type="button" value="上傳" /></p> </form>
ajax請(qǐng)求服務(wù)器
<script>
function uploadfile(){
$.ajax({
url : "/url/upload",
data: new FormData($("#form-avatar")[0]),
type : "POST",
// 告訴jQuery不要去處理發(fā)送的數(shù)據(jù),用于對(duì)data參數(shù)進(jìn)行序列化處理 這里必須false
processData : false,
// 告訴jQuery不要去設(shè)置Content-Type請(qǐng)求頭
contentType : false,
success : function(json) {
alert("執(zhí)行成功");
},
error : function(json) {
alert("執(zhí)行失敗");
}
});
}
$("#btn-avatar").on("click",uploadfile);
</script>
Conroller.java
@PostMapping("/upload")
public void fileUpload2(@RequestParam("file") CommonsMultipartFile file, HttpServletRequest request) throws IOException {
System.out.println("走了");
//上傳路徑保存設(shè)置
String path = request.getServletContext().getRealPath("/upload");
File realPath = new File(path);
if (!realPath.exists()) {
realPath.mkdir();
}
//上傳文件地址
System.out.println("上傳文件保存地址:" + realPath);
//通過(guò)CommonsMultipartFile的方法直接寫文件(注意這個(gè)時(shí)候)
file.transferTo(new File(realPath + "/" + file.getOriginalFilename()));
}
結(jié)果

以上就是本文的全部?jī)?nèi)容,希望對(duì)大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。
相關(guān)文章
Ajax標(biāo)簽導(dǎo)航效果(仿網(wǎng)易首頁(yè))
Ajax標(biāo)簽導(dǎo)航效果(仿網(wǎng)易首頁(yè))...2006-10-10
解決ajax返回驗(yàn)證的時(shí)候總是彈出error錯(cuò)誤的方法
這篇文章主要介紹了解決ajax返回驗(yàn)證的時(shí)候總是彈出error錯(cuò)誤的方法,感興趣的小伙伴們可以參考一下2016-01-01
使用Ajax模仿百度搜索框的自動(dòng)提示功能實(shí)例
今天小編就為大家分享一篇使用Ajax模仿百度搜索框的自動(dòng)提示功能實(shí)例,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧2019-02-02
js結(jié)合json實(shí)現(xiàn)ajax簡(jiǎn)單實(shí)例
這篇文章主要為大家詳細(xì)介紹了js結(jié)合json實(shí)現(xiàn)ajax簡(jiǎn)單實(shí)例的相關(guān)資料,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2017-05-05
使用wordpress的$wpdb類讀mysql數(shù)據(jù)庫(kù)做ajax時(shí)出現(xiàn)的問(wèn)題該如何解決
這篇文章主要介紹了使用wordpress的$wpdb類讀mysql數(shù)據(jù)庫(kù)做ajax時(shí)出現(xiàn)的問(wèn)題該如何解決的相關(guān)資料,需要的朋友可以參考下2015-10-10
關(guān)于異步請(qǐng)求ajax原理以及原生Ajax、$.ajax的基本使用詳解
這篇文章主要介紹了關(guān)于異步請(qǐng)求ajax原理以及原生Ajax、$.ajax的基本使用詳解,ajax現(xiàn)在是前后端交互的重要工具,可以說(shuō),只要從事于it行業(yè),ajax那就是必須要掌握的一名技術(shù),下面我們就來(lái)對(duì)ajax進(jìn)行介紹,需要的朋友可以參考下2023-05-05

