上传图片实时显示 兼容 ie11

html:

<style type="text/css">
  .imgOnloadWrap{ 150px; height: 200px;}
  #img1{ 150px; height: 200px;}
</style>

<div class="imgOnloadWrap">

  <img id="img1" name="fileimage"  src="<c:url value='/${bean.fileUrl }' />" />

</div>  

 <input type="file" style="10px;" size="1" class="btn_add_pic" id="file" name="file" onchange="upImg(this)" />  

js:

  

function upImg(obj){
  var $file = obj;

  注:这种方式ie11不兼容   var imgFile = obj.files[0];

  替换成:var fileObj = $file[0]; 
  var fileObj = $file[0];
  var windowURL = window.URL || window.webkitURL;
  var dataURL;
  var $img = $("#img1");
  if(fileObj && fileObj.files && fileObj.files[0]){
    dataURL = windowURL.createObjectURL(fileObj.files[0]);
    $img.attr('src',dataURL);
  }else{
    $('.imgOnloadWrap img').remove();
    var htmlStr = '';
    htmlStr += '<img id="img1" src=""/>';
    $('.imgOnloadWrap').append(htmlStr);
    dataURL = $file.value;
    var imgObj = document.getElementById("img1");
    imgObj.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod=scale)";
    imgObj.filters.item("DXImageTransform.Microsoft.AlphaImageLoader").src = dataURL;

  }
}

java:

//上传文件
private File file;
//上传文件名
private String fileFileName;
//上传文件内容类型
private String fileContentType;
//上传文件存放路径
private final static String UPLOADDIR = "/common/uploadEmpImage";

/**
* 上传照片
* @param file
* @param fileFileName
* @return
* @throws IOException
*/
public String saveImage(File file,String fileFileName) throws IOException{
  Date day=new Date();
  SimpleDateFormat df = new SimpleDateFormat("yyyy-MM-dd");
  InputStream in = new FileInputStream(file);
  String dir = Struts2Util.getRequest().getRealPath(UPLOADDIR);
  File fileLocation = new File(dir);
  //此处也可以在应用根目录手动建立目标上传目录
  if(!fileLocation.exists()){
    boolean isCreated = fileLocation.mkdir();
    if(!isCreated) {
      //目标上传目录创建失败,可做其他处理,例如抛出自定义异常等,一般应该不会出现这种情况。
      return "";
    }
  }
  String Name=this.getFileFileName();
  String fileName=df.format(day)+"-"+this.getRandomString(5)+"-"+Name;
  File uploadFile = new File(dir, fileName);
  OutputStream out = new FileOutputStream(uploadFile);
  byte[] buffer = new byte[1024 * 1024];
  int length;
  try {
    while ((length = in.read(buffer)) > 0) {
      out.write(buffer, 0, length);
    }
  } catch (Exception e) {
    e.printStackTrace();
  }
  in.close();
  out.close();
  fileFileName=UPLOADDIR+"\"+fileName;
  return fileFileName;
}

//随机获取

public static String getRandomString(int length){
  String str="abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789";
  Random random=new Random();
  StringBuffer sb=new StringBuffer();
  for(int i=0;i<length;i++){
    int number=random.nextInt(62);
    sb.append(str.charAt(number));
  }
  return sb.toString();
}

//删除上传的图片

public Boolean doDelImage(String fileUrl){
  boolean check=false;
  File delfile=new File(Struts2Util.getRequest().getRealPath("/")+fileUrl);
  if(delfile!=null){
    check=delfile.delete();
  }
  return check;
}

 ==============================================多图片上传=====================================================================

package com.cpsec.tang.chemical.action;

import java.io.File;
import java.io.FileInputStream;
import java.io.FileNotFoundException;
import java.io.FileOutputStream;
import java.io.IOException;
import java.io.InputStream;
import java.io.OutputStream;
import java.util.List;
import javax.servlet.http.HttpServletRequest;
import org.apache.struts2.ServletActionContext;
import com.opensymphony.xwork2.ActionSupport;


/**
* 多文件上传
*/
public class FilesUploadAction extends ActionSupport {
//上传文件存放路径
private final static String UPLOADDIR = "/upload";
//上传文件集合
private List<File> file;
//上传文件名集合
private List<String> fileFileName;
//上传文件内容类型集合
private List<String> fileContentType;

public List<File> getFile() {
return file;
}

public void setFile(List<File> file) {
this.file = file;
}

public List<String> getFileFileName() {
return fileFileName;
}

public void setFileFileName(List<String> fileFileName) {
this.fileFileName = fileFileName;
}

public List<String> getFileContentType() {
return fileContentType;
}

public void setFileContentType(List<String> fileContentType) {
this.fileContentType = fileContentType;
}


public String uploadform() throws Exception {
HttpServletRequest request = ServletActionContext.getRequest();
String webpath=null;//上传路径
for (int i = 0; i < file.size(); i++) {
//循环上传每个文件
uploadFile(i);
webpath="upload/"+this.getFileFileName().get(i);
}
return "SUCCESS";
}



//执行上传功能
private String uploadFile(int i) throws FileNotFoundException, IOException {
try {

InputStream in = new FileInputStream(file.get(i));
String dir = ServletActionContext.getRequest().getRealPath(UPLOADDIR);
File fileLocation = new File(dir);
//此处也可以在应用根目录手动建立目标上传目录
if(!fileLocation.exists()){
boolean isCreated = fileLocation.mkdir();
if(!isCreated) {
//目标上传目录创建失败,可做其他处理,例如抛出自定义异常等,一般应该不会出现这种情况。
return null;
}
}
String fileName=this.getFileFileName().get(i);
File uploadFile = new File(dir, fileName);
OutputStream out = new FileOutputStream(uploadFile);
byte[] buffer = new byte[1024 * 1024];
int length;
while ((length = in.read(buffer)) > 0) {
out.write(buffer, 0, length);
}
in.close();
out.close();
return uploadFile.toString();
} catch (FileNotFoundException ex) {
return null;
} catch (IOException ex) {
return null;
}
}
}

原文地址:https://www.cnblogs.com/jiaobaobao/p/8875235.html