淘先锋技术网

首页 1 2 3 4 5 6 7

在Web开发的过程中,上传图片一直是一个必须要涉及到的问题,而Java和jQuery两个技术在实现上传图片方面都有很不错的表现。下面介绍一下如何使用Java和jQuery来实现上传图片。

第一步是在Java中编写上传图片的代码。

//上传图片的代码
@RequestMapping(value="/upload",method=RequestMethod.POST)
@ResponseBody
public String upload(@RequestParam("file")MultipartFile file,HttpServletRequest request) throws Exception{
String fileName=file.getOriginalFilename();
String suffix=fileName.substring(fileName.lastIndexOf(".")+1);
if(suffix.equals("jpg") || suffix.equals("jpeg") || suffix.equals("png") || suffix.equals("bmp")){        
String filePath=request.getServletContext().getRealPath("/")+"uploadFiles/";
File fileDir=new File(filePath);
if(!fileDir.exists()){
fileDir.mkdirs();
}
File target=new File(filePath+fileName);
file.transferTo(target);
return "上传成功";
}else{
return "上传失败";
}
}

如上述代码所示,首先获取上传的图片文件,然后获取该文件的后缀名进行校验,如果是jpg、jpeg、png、bmp文件,则将文件保存到指定目录下。

第二步是在jQuery中编写上传图片的代码。

//上传图片的代码
$("button").on("click", function() {
var formData = new FormData($("#uploadForm")[0]);
var url = "http://localhost:8080/upload";
$.ajax({
url: url,
type: 'POST',
data: formData,
async: false,
cache: false,
contentType: false,
processData: false,
success: function(data) {
console.log(data);
alert("上传成功!");
},
error: function(data) {
console.log(data);
alert("上传失败!");
}
});
});

如上述代码所示,首先获取上传form表单中的内容,然后通过ajax将数据传递到Java中,最后显示上传结果。

综上所述,使用Java和jQuery实现上传图片非常简单,只需要按照上述两个步骤进行操作即可。希望以上介绍对大家能够有所帮助。