解决网页异步上传图片时不断更换预览图片时数据库累积文件问题与ajaxUploadFile上传多个参数问题

 
 

  
  解决网页异步上传图片时不断更换预览图片时数据库累积文件问题与ajaxUploadFile上传多个参数问题

 
 
 
 

  
  https://code.csdn.net/snippets/297371.git

 
 
 
 

  
  

 
 
 
 

  
  /*******************************jsp部分*****************************************/
 
 
 
 
 
  
  <
  
  input 
  
  name
  
  =
  
  "photo" 
  
  id
  
  =
  
  "photo" 
  
  type
  
  =
  
  "file" 
  
  class
  
  =
  
  "input_file" 
  
  onchange
  
  =
  
  "ajaxPreImage()"
  
  >
 
 
 
 
 
  
  <
  
  input 
  
  type
  
  =
  
  "hidden" 
  
  id
  
  =
  
  "oldPhoto" 
  
  name
  
  =
  
  "oldPhoto" 
  
  value
  
  =
  
  "firstIndex"
  
  />
 
 
 
 

  
  /*******************************js代码部分*****************************************/
 
 
 
 

  
  function 
  
  ajaxPreImage
  
  (
  
  imgfileId
  
  , 
  
  imgcontainerId
  
  ) 
  
  {  
 
 
 
 
	
  
  var 
  
  date 
  
  = 
  
  $
  
  (
  
  '#
  
  oldPhoto
  
  '
  
  ).
  
  val
  
  ();
 
 
 
 
  
  
  $
  
  .
  
  ajaxFileUpload
  
  ({  
 
 
 
 
    
  
  fileElementId: 
  
  '
  
  photo
  
  '
  
  ,  
 
 
 
 
    
  
  url: 
  
  '
  
  /
  
  BusinessAction
  
  !
  
  ajaxUploadImage
  
  .
  
  action
  
  ?
  
  oldPhoto
  
  =
  
  '
  
  +
  
  date
  
  ,  
  
  //重要技巧：上传两个参数给action
 
 
 
 
    
  
  dataType: 
  
  '
  
  text
  
  '
  
  ,  
 
 
 
 
   
  
  // data: {oldPhoto:date}, 
 
 
 
 
    
  
  beforeSend: 
  
  function 
  
  (
  
  XMLHttpRequest
  
  ) 
  
  {  
 
 
 
 
      
  
  //("loading");  
 
 
 
 
    
  
  },  
 
 
 
 
    
  
  success: 
  
  function 
  
  (
  
  data
  
  , 
  
  textStatus
  
  ) 
  
  {  
 
 
 
 
     
  
  $
  
  (
  
  '#
  
  img
  
  '
  
  ).
  
  attr
  
  (
  
  '
  
  src
  
  '
  
  ,
  
  data
  
  .
  
  replace
  
  (
  
  "<pre style=\"word-wrap: break-word; white-space: pre-wrap;\">"
  
  ,
  
  ""
  
  ).
  
  replace
  
  (
  
  "</pre>"
  
  ,
  
  ""
  
  ));
 
 
 
 
     
  
  $
  
  (
  
  '#
  
  oldPhoto
  
  '
  
  ).
  
  val
  
  (
  
  data
  
  .
  
  replace
  
  (
  
  "<pre style=\"word-wrap: break-word; white-space: pre-wrap;\">"
  
  ,
  
  ""
  
  ).
  
  replace
  
  (
  
  "</pre>"
  
  ,
  
  ""
  
  ));
 
 
 
 
    
  
  },  
 
 
 
 
    
  
  error: 
  
  function 
  
  (
  
  XMLHttpRequest
  
  , 
  
  textStatus
  
  , 
  
  errorThrown
  
  ) 
  
  {  
 
 
 
 
    	
  
  alert
  
  (
  
  '上传图片失败'
  
  );  
 
 
 
 
    
  
  },  
 
 
 
 
    
  
  complete: 
  
  function 
  
  (
  
  XMLHttpRequest
  
  , 
  
  textStatus
  
  ) 
  
  {  
 
 
 
 
      
  
  //("loaded");  
 
 
 
 
    
  
  }  
 
 
 
 
  
  
  });  
 
 
 
 

  
  }  
 
 
 
 


 
 
 
 

  
  /*******************************java部分*****************************************/
 
 
 
 


 
 
 
 

  
  /**
 
 
 
 

  
  	 * 异步上传图像
 
 
 
 

  
  	 */
 
 
 
 
	
  
  public 
  
  void 
  
  ajaxUploadImage
  
  () 
  
  {
 
 
 
 
		
  
  String 
  
  oldPhoto 
  
  = 
  
  request
  
  .
  
  getParameter
  
  (
  
  "oldPhoto"
  
  );
 
 
 
 
		
  
  if
  
  (
  
  SimpleToof
  
  .
  
  checkNotNull
  
  (
  
  oldPhoto
  
  ))  
  
  //删除旧的图片
 
 
 
 
			
  
  SimpleToof
  
  .
  
  deleteFile
  
  (
  
  SimpleToof
  
  .
  
  getRealpath
  
  (
  
  oldPhoto
  
  ));
 
 
 
 
		
  
  if
  
  (!
  
  SimpleToof
  
  .
  
  checkNotNull
  
  (
  
  photo
  
  ))
  
  throw 
  
  new 
  
  RuntimeException
  
  (
  
  "你没有传上来数据"
  
  );
 
 
 
 
		
  
  String 
  
  savePath 
  
  = 
  
  ""
  
  ;
 
 
 
 
		
  
  try 
  
  {
 
 
 
 
			
  
  if 
  
  (
  
  StringUtils
  
  .
  
  isNotEmpty
  
  (
  
  photoContentType
  
  )&& 
  
  StringUtils
  
  .
  
  isNotEmpty
  
  (
  
  photoFileName
  
  ) 
  
  && 
  
  null 
  
  != 
  
  photo
  
  ) 
  
  {
 
 
 
 
				
  
  savePath 
  
  = 
  
  UploadUtil
  
  .
  
  saveFile
  
  (
  
  1
  
  , 
  
  UploadUtil
  
  .
  
  IMAGE
  
  , 
  
  null
  
  ,
 
 
 
 
						
  
  null
  
  , 
  
  photo
  
  , 
  
  photoFileName
  
  , 
  
  photoContentType
  
  ,
 
 
 
 
						
  
  "/upload/temp"
  
  , 
  
  true
  
  );
 
 
 
 
			
  
  }
 
 
 
 
		
  
  } 
  
  catch 
  
  (
  
  Exception 
  
  e
  
  ) 
  
  {
 
 
 
 
			
  
  e
  
  .
  
  printStackTrace
  
  ();
 
 
 
 
			
  
  savePath 
  
  = 
  
  "ERROR"
  
  ;
 
 
 
 
		
  
  }
 
 
 
 
		
  
  WebUtil
  
  .
  
  AJAXMsg
  
  (
  
  savePath
  
  );
 
 
 
 
	
  
  }