web客户端通过ajaxfileupload方式上传文件

fileUpload.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>Insert title here</title>
        <script type="text/javascript" src="jQuery/jquery-1.9.1.min.js"></script>
        <script type="text/javascript" src="jQuery/ajaxfileupload.js"></script>
        <script type="text/javascript">
          function fileClick(){
            if (confirm("摄像文件录制完成，是否上传？(默认存放目录：C:\\OCXRecordFiles)"))  {
              $("#file").click();  
            }  else  { 
              return;                
            }; 
          }
          function ajaxFileUpload()
          {   
                alert("ajaxFileUpload()函数");
              $.ajaxFileUpload
              (
                  {
                      url:'fileUploadServlet',//用于文件上传的服务器端请求地址
                      secureuri:false,//一般设置为false
                      fileElementId:'file',//文件上传空间的id属性  <input type="file"  />
                      dataType: 'json',//返回值类型 一般设置为json
                      data: {//加入的文本参数   
                          "logoPath": "param1",   
                          "logoName": "param2"  
                      },                       
                      success: function (data, status)  //服务器成功响应处理函数
                      {
                            alert("ajax成功返回");
                          //alert(data.message);//从服务器返回的json中取出message中的数据,其中message为在struts2中定义的成员变量
                          if(typeof(data.error) != 'undefined')
                          {
                              if(data.error != '')
                              {
                                  //alert(data.error);
                              }else
                              {
                                  //alert(data.message);
                              }
                          }
                      },
                      error: function (data, status, e)//服务器响应失败处理函数
                      {
                          alert(e);
                      }
                  }
              );
              return true;
          }
          
          function openBrowse(){ 
            var ie=navigator.appName=="Microsoft Internet Explorer" ? true : false; 
            if(ie){ 
              document.getElementById("file").click(); 
              document.getElementById("filename").value=document.getElementById("file").value;
            }else{
              var a=document.createEvent("MouseEvents");//FF的处理 
              a.initEvent("click", true, true);  
              document.getElementById("file").dispatchEvent(a); 
            } 
          } 
    </script>
    </head>
    <body>
      <input type="file" id="file"name="file" style="display:none" onchange="ajaxFileUpload()"/> 
      <input type="button" name="button" value="点我就像点击“浏览”按钮一样" onclick="javascript:openBrowse();" />
      <input type="text" id="filename"/> 
        <!-- 
        <input type="file" />
        <input type="button" value="上传" onclick="fileClick()">               
         -->        
        <!-- 
        <style>
        #file{position:absolute;filter:alpha(opacity=0);opacity:0;size:1;width:50px}
        </style>
        
        <input type="file"  />
        <input type="button" value="上传" >           
         -->    
        <FORM METHOD=POST ACTION="fileUploadServlet" enctype="multipart/form-data">
        <A hideFocus class=addfileA id=aComposeAttach href="#">&nbsp;<INPUT hideFocus class=addfileI type=file size=1 name="FF" onchange="this.form.submit()"></A>
        <INPUT TYPE="submit" value="提交">
        </FORM>
        
    </body>
</html>
View Code