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

个人笔记，以备后用.

 

表体代码：

<td colspan="3">
	<s:file label="上传" name="uploadFile" id="uploadNumFile" οnchange="fileUpload('uploadNumFile','goodsRecordDtl_goodsPicture','goodsPicture_img')" />
	<a href="#" title="查看" οnclick="viewPic('viewPicture1','goodsPicture','goodsRecordDtl_goodsPicture');">查看图片</a>
	<div id="viewPicture1" title="图片预览" style="display: none;" align="center">
		<img id="goodsPicture" src="">
	</div>
</td>

 

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;
    }

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