form表单图⽚上传
1、前端页⾯
<div class="tkDiv" id="addLOGO" >
<div class="tk1_header" >
<span id="gn_title">添加主页图⽚</span>
<a id="close_modal" >×</a>
</div>
<div class="tk1" id="addZ" >
<div class="tk1_content" id="registerDiv" >
<form id="imageForm" class="bs-docs-example form-horizontal" method="post" action="<%=path %>/
webCenter.do" enctype="multipart/form-data">
<input type="hidden" name="method" value="saveConferencesImage">
<input type="hidden" id="imageId" name="imageId" value="-1">
<table >
<tr height="50px">
<td align="right" width="150px" >
图⽚名称
</td>
<td>
<input id="imageName" class="form-control" name="imageName" type="text" />
</td>
</tr>
<tr height="50px">
<td align="right" width="150px" >
上传图⽚
</td>
<td>
<input id="imageFile"  name="imageFile" type="file" />
</td>
</tr>
</table>
</form>
</div>
<div >
<input id="saveBtn" type="button" class="button" value="添 加" />    </div>
</div>
  2、js代码
$(function(){
$("#saveBtn").click(function(){
var imageName = $("#imageName").val();
var imageFile = $("#imageFile").val();
if(imageName == '' || imageName.length == 0){
alert("请输⼊图⽚名称");
return;
}if(imageFile == '' || imageFile.length == 0){
alert("请选择要上传的图⽚");
return;
}
var formData = new FormData();
formData.append("imagePath", $("#imageFile")[0].files[0]);
$.ajax({
url:"<%=path%>/webCenter.do?uploadConImage",
type:"post",
data:formData,
dataType:"json",
// 告诉jQuery不要去处理发送的数据
processData: false,
// 告诉jQuery不要去设置Content-Type请求头
contentType: false,
beforeSend: function () {
console.log("正在进⾏,请稍候");
},
success:function(data){
if(data.state == 0){
alert(data.msg)
}else{
$("#imageForm").submit();
}
}
})
})
})
  3、后台数据处理
  ①第⼀步验证图⽚⼤⼩
//判断图⽚⼤⼩,不是这个⼤⼩的提⽰不能上传
@RequestMapping(params = "uploadConImage",method = RequestMethod.POST)
public void uploadConImage(HttpServletRequest request,HttpServletResponse response){
try{
MultipartHttpServletRequest mRequest = (MultipartHttpServletRequest) request;
MultipartFile mFile = File("imagePath");
InputStream is = InputStream();//输⼊流
BufferedImage bufferedImg = ad(is);
int width = Width();//获取图⽚宽⾼
int height = Height();
JSONObject json = new JSONObject();
if(width != 500 && height != 300){
float bili = (float)(new Float(height)/new Float(width));
float  b  =  (float)(und(bili*100))/100;
if(b != new Float(0.45)){
json.accumulate("state", 0);
json.accumulate("msg", "请上传分辨率为500*300的图⽚或者长宽⽐为0.6的图⽚(⾼除以宽为0.6)");
}else{
json.accumulate("state", 1);
}
}else{
json.accumulate("state", 1);
}
writeJson(response, String());
} catch (Exception e) {
e.printStackTrace();
}
}
  ②在js⾥⾯⽤$("#imageForm").submit();提交form表单,上传图⽚。注意:⽤form表单上传图⽚时,在from表单上要添加  enctype="multipart/form-data"  属性。form表单看上⾯代码,下⾯是后台数据处理。
@RequestMapping(params = "method=saveConferencesImage",method = RequestMethod.POST)
public void saveConferencesImage(int imageId,String imageName,HttpServletRequest request,HttpServletResponse response){
try {
HttpSession session  = Session(request);
Adminuser adminUser = Attribute("centerAdminUser") == null?null:(Adminuser) Attribute("centerAdminUser");
if(adminUser == null){
try {
response.ContextPath()+"/center/index.jsp");
} catch (Exception e) {
e.printStackTrace();
}
}else{
String conId = Session().getAttribute("conId") == null ? null: Session().getAttribute("conId").toString();
if (conId == null) {
response.ContextPath()+"/center/index.jsp");
}
Conferences conferences = ConferencesById(Integer.parseInt(conId));
ConferencesImage conferencesImage = null;
if(imageId == -1){
conferencesImage = new ConferencesImage();
}else{
conferencesImage = ConferencesImageById(imageId);
}
conferencesImage.setConferencesId(Integer.parseInt(conId));
conferencesImage.setImageName(imageName);
int level = ConferencesImageLevel(Integer.parseInt(conId));
conferencesImage.setLevel(level);
MultipartHttpServletRequest mRequest = (MultipartHttpServletRequest)request;
MultipartFile mFile = File("imageFile");
String fileName= OriginalFilename();//获取⽂件名
fileName = fileName.substring(fileName.lastIndexOf("."),fileName.length());
String newFileName = String.valueOf(System.currentTimeMillis())+"_mainPage"+fileName;
String filePath = Session().getServletContext().getRealPath("/");
filePath = filePath + Abbreviation()+"/images/mainPage/";
File file = new File(filePath);
if(!ists()){
file.mkdirs();
}
File saveFile = new File(filePath+newFileName);
conferencesImage.setImageUrl("/"+Abbreviation()+"/images/mainPage/"+newFileName);
webService.saveObject(conferencesImage);
response.ContextPath()+"/webCenter.do?getConferencesImage");
}
} catch (Exception e) {
e.printStackTrace();
}
}
getsavefilename

版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。