ajax上传图片(servlet)

 <form name="upfile_form" action="UploadServlet" method="POST" enctype="multipart/form-data">
 <p>input file title：
   <input type="text" name="file_title" />
  </p>
  <p>select less than 200K file：
   <input type="file" name="upload_file" id="upload_file" οnchange="checkFileSize(this);" />
  </p>
  <p>
   <input type="submit" value="submit" />
  </p>
  <iframe name="check_file_frame" style="display:none;"></iframe>
</form>

------sample.html

 

------web.xml---

<servlet>
    <servlet-name>UploadServlet</servlet-name>
    <servlet-class>com.test.servlet.UploadServlet</servlet-class>
</servlet>

<servlet-mapping>
    <servlet-name>UploadServlet</servlet-name>
    <url-pattern>/UploadServlet</url-pattern>
</servlet-mapping>

------servlet-----

public class UploadServlet extends HttpServlet
{

public void doPost(HttpServletRequest request, HttpServletResponse response)
    throws ServletException, IOException
{
   request.setCharacterEncoding("UTF-8");
   DiskFileItemFactory factory=new DiskFileItemFactory();
   String path=request.getRealPath("/upload");
   factory.setRepository(new File(path));
   factory.setSizeThreshold(1024*1024);
 
   ServletFileUpload upload=new ServletFileUpload(factory);
   try{
    List<FileItem> list=upload.parseRequest(request);
  
    for(FileItem item:list)
    {
     if(item.isFormField())
     {
      String name=item.getFieldName();
      String value=item.getString("UTF-8");
      request.setAttribute(name, value);
     }
     else
     {
      String name=item.getFieldName();
      String value=item.getName();
      int start=value.lastIndexOf("\\");
      String fileName=value.substring(start+1);
      request.setAttribute(name, fileName);
    
      item.write(new File(path,fileName));
      /*OutputStream os=new FileOutputStream(new File(path,fileName));
    
      InputStream is=item.getInputStream();
    
      byte []buffer=new byte[400];
      int length=0;
    
      while((length=is.read(buffer))>0)
      {
       os.write(buffer,0,length);
      }
      os.close();
      is.close();*/
    
     }
    }
   }
   catch (Exception e) {
    e.printStackTrace();
   }
   request.getRequestDispatcher("/result.jsp").forward(request, response);
}

}

注意：需要添加commons-fileupload.jar commons-io.jar

-------check_file.js

 

var fileForm = new Object();
function checkFileSize(fileObj) {
  if(fileObj.value != "") {
    var form = document.forms['upfile_form'];

    //把form的原始数据缓存起来
    fileForm.f = form;
    fileForm.a = form.getAttribute("action");  //form.action 为一个静态的对象，所以这里要使用getAttribute方法取值
    fileForm.t = form.target;

    //请求服务器端
    form.target = "check_file_frame";
    //form.action = "./ajax.php?act=upload";
    form.action = "UploadServlet";
    //form.submit(); 其实上面的action已经会执行submit操作，这步可有可无
  }
  return false;
}

function ajax_callback(result) {
  //还原form属性
  fileForm.f.target = fileForm.t;
  fileForm.f.setAttribute("action", fileForm.a);

  //处理结果
  switch(result) {
    case 0:
      alert("文件超过了200K或者没有选择文件，请重新上传！");
      //todo somthing
    default :
      alert("合法");
      //do somthing，如果你想使用这种方法实现真正的上传的话，那么在成功后把返回的文件路经存储在一个 input[hidden]里是个不错的办法
  }
  return ;
}