java ajax上传图片插件_java图片上传并预览，前台用jQuery插件AjaxFileUpload，后台用FileUtils.copyFile....

个人笔记，以备后用.

表体代码：

查看图片

js代码(记得要引入jquery库和ajaxfileupload库)：

//上传文件id号

function fileUpload(uploadFileId,filePathId,imgId){

var imp= document.getElementById(uploadFileId);

if(imp==null ||imp==""||imp== undefined){

alert('请选择文件');

return;

}

$.ajaxFileUpload({

url:ct +"uploadFile.do",

secureuri:false,

fileElementId:uploadFileId,

dataType: 'multipart/form-data',

success: function (data, status){

var json = eval('(' + data + ')');

if(json.msg=="1"){

alert("上传成功");

$('#'+filePathId).val(json.path);

$('#'+imgId).attr("src",eTrade.ctx+"/upload/"+json.path);

}else{

alert("文件上传失败");

}

},

error: function (data, status, e){

alert(e);

}

});

}

function viewPic(dialogId,imgId,fileId){

$("#"+dialogId).dialog({

height: 350,

width: 600,

buttons: {

"取消": function() {

$("#"+imgId).attr("src","");

$(this).dialog("close");

}

},

close:function(){

$("#"+imgId).attr("src","");

}

});

if($("#"+fileId).val()==""){

return;

}

$("#"+imgId).attr("src",ct+"/toView.do?attachment="+$("#"+fileId).val());

}

后台代码(uploadFile命名必须与前台name="uploadFile"值一致)：

private File uploadFile;

public File getUploadFile() {

return uploadFile;

}

public void setUploadFile(File uploadFile) {

this.uploadFile = uploadFile;

}

@Action(value = "uploadFile", results = { @Result(name = "success", type = "json", params = {

"ignoreHierarchy", "false","contentType","text/html", "root", "dataMap" }) })

public String uploadFile() {

try {

String UPLOAD_PATH= ServletActionContext.getServletContext().getRealPath("/upload/");

String randomName= UUID.randomUUID().toString()+ ".jpg";

if(uploadFile!=null){

File storageFile = new File(UPLOAD_PATH +"/"+randomName);

FileUtils.copyFile(uploadFile, storageFile);

}

dataMap.put("msg", 1);

dataMap.put("path", randomName);//文件id号

} catch (Exception e) {

logger.error("", e);

dataMap.put("msg", 0);

}

return SUCCESS;

}

以上代码可能有些不全，但是大体思路就是这样，仅仅只是为了以后用的时候方便查看。

原文：http://blog.csdn.net/xlb744868186/article/details/42424069