一个简单的jQuery插件ajaxfileupload实现ajax上传文件例子

页面代码：

?

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39

< html >      <!-- 引入相关的js文件，相对路径  -->      < script  type = "text/javascript"  src = "js/jquery.js" ></ script >        < script  type = "text/javascript"  src = "js/ajaxfileupload.js" ></ script >      <!-- 执行上传文件操作的函数 -->        < script  type = "text/javascript" >            function ajaxFileUpload(){                 $.ajaxFileUpload(                     {                  url:'update.do?method=uploader',            //需要链接到服务器地址                  secureuri:false,                  fileElementId:'houseMaps',                        //文件选择框的id属性                  dataType: 'xml',                                     //服务器返回的格式，可以是json                  success: function (data, status)            //相当于java中try语句块的用法                  {                            $('#result').html('添加成功');                  },                  error: function (data, status, e)            //相当于java中catch语句块的用法                  {                      $('#result').html('添加失败');                  }              }                                      );                            }        </ script >    </ head >        < body >        < form  method = "post"  action = "update.do?method=uploader"  enctype = "multipart/form-data" >            < input  type = "file"  id = "houseMaps"  name = "houseMaps" />           < input  type = "button"  value = "提交"  onclick = "ajaxFileUpload()" />      </ form >       < div  id = "result" ></ div >          </ body > </ html >

 

服务器代码：

?

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25

public  class  UpdateAction  extends  DispatchAction {      public  ActionForward uploader(ActionMapping mapping, ActionForm form,              HttpServletRequest request, HttpServletResponse response) {          UpFormForm upFormForm = (UpFormForm) form;          FormFile ff = upFormForm.getHouseMaps();          try  {              InputStream is = ff.getInputStream();              File file =  new  File( "D:/"  + ff.getFileName());             //指定文件存储的路径和文件名              OutputStream os =  new  FileOutputStream(file);                            byte [] b =  new  byte [ 1024 ];              int  len =  0 ;              while ((len = is.read(b)) != - 1 ){                  os.write(b,  0 , len);              }              os.close();              is.close();          }  catch  (Exception e) {              e.printStackTrace();                        }                    return  null ;      } }

 

注解：服务器代码可以是之前Struts实现的文件上传中的Action中的方法；

主要就是Ajax上传文件的方法；需指明以下内容：

  url：'';         //需要链接到服务器地址
  fileElementId:'',  //文件选择框的id属性