第一种使用普通的上传方法
后台服务器代码:
@RequestMapping(value = "/uploadImg")
public @ResponseBody
String addImg(@ModelAttribute("pager") Pager pager,
HttpServletRequest request, HttpServletResponse response,
HttpSession session, ModelMap model,
@RequestParam("images") CommonsMultipartFile images) {
JSONObject jsono=new JSONObject();
String path = Jimages.getRoot();//此处为获取商品存储的位置,这个方法你们可以自己写
String filenewName = Jimages.getImageNmae();//这个方法是生成存储的图片的名称,把它和位置拼在一起就是图片的文件名
try {
images.getFileItem().write(new File(path + "/" + filenewName));//生成图片
} catch (Exception e) {
filenewName = "";
jsono.put("code", "1");
}
jsono.put("code", "1");
jsono.put("filname",Jimages.getdomain()+"/"+filenewName);
return jsono.toString();
}
前台页面代码:
<form action="/admin/updateBackImage" method="post" enctype="multipart/form-data">
<input type="hidden" name="commid" value="-1"/>
<input type="file" name="images" />
<input type="submit" name="file" value="上传"/>
</form>
2.使用ajax方法提交:
因为用过jquery上传过表单,以为也可以。(这个方法只能提交普通的信息,如文本,文件不可以!)
$.ajax({
url : "/admin/upload",
cache : false,
type : "POST",
data : $("#表单ID").serialize(),
dataType : "json",
beforeSend : function() {//图片提交到服务器返回信息之前的所做的操作
},
success : function(html) {//图片上传成功后的方法
},
error : function() {//图片上传失败方法
}
});
但是以上这种方法在上传一般信息是可以的额,但是如果你想上传图片是不可以的。
这个时候我们需要一个juqery的另一个 插件叫做("jquery.form.js") 。注意下载的版本,我就犯了一个很无聊的错误。因为下载的版本出错,导致我的上传老是失败,失败原因就是 找不到 Jquery的 handleError方法,这个handleError在jqery1.4还是1.3的时候还有,但是之后的版本就没有。所以请自己到官方下载jquery.form.js最近版本。后台代码都是那一个!
$("#表单ID").ajaxSubmit({
url: "/admin/uploadImg",
data: "",
dataType: "JSON",
beforeSubmit:function(){//上传成功之前的方法
},success: function(html) {//上传成功之后的方法
},error: function(html) {//上传失败的之后的方法
}
});