struts2实现多文件异步上传
1.struts2本身不支持异步上传文件,需要相应的插件支持,这里用jquery.js和jquery.form.js来实现。
jquey.form.js版本: 3.42.0
jquey.js版本:1.7.2
刚开始用的jquery.form.js做上传时用的2012年的一个老版本,发现在ie,firefox,google兼容性方面很不好处理,换成这个最新的版本后还是可以处理的。
2.这里主要贴下异步上传的兼容性处理代码,其他的后端代码可以下载附件查看。
response.reset();
response.setContentType("text/html");
pw = response.getWriter();
pw.print("<textarea>"+jsonData.toString()+"</textarea>");
<head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>上传页面</title> <script type="text/javascript" src='<s:url value="/js/jquery-1.7.2.min.js"></s:url>'></script> <script type="text/javascript" src='<s:url value="/js/jquery.form.js"></s:url>'></script> <script type="text/javascript"> function postFile() { $(document).ready(function() { var num=0; $("input[type=file]").each(function(i,n){ if($(n).val() && $(n).val() != ''){ num++; return false; } }); if(num == 0){ alert("请选择要上传的文件!"); return; } $("#fileForm").ajaxSubmit({ type : 'post', url : 'upload/fileupload!doMultiUpload', success : function(data) { if(data.success.length > 0){ alert("『"+data.success.join()+"』上传成功!"); } if(data.error.length > 0){ alert("『"+data.error.join()+"』上传失败!"); } $("#fileForm").resetForm(); }, error : function(xhr, ts, et){ alert("上传失败,请检查文件类型和大小!"); }, dataFilter : function(data,type){ if(!$.browser.msie && type === "json"){ return data.replace("<textarea>","").replace("</textarea>",""); }else{ return $.parseJSON(data); } }, dataType:'json' }); }); } </script> </head> <body> <s:form id="fileForm" name="fileForm" enctype="multipart/form-data" method="post" > <%-- <s:file name="upload" label="上传文件"></s:file> --%> <s:file id="multi1" name="multi" label="上传文件"></s:file> </br> <s:file id="multi2" name="multi" label="上传文件"></s:file> </br> <%-- <s:submit value="提交"></s:submit> --%> <input type="button" value="提交" onclick="postFile()"/> </s:form> </body>
这里主要是为了说明,用jquery做异步上传中的问题,其中代码是解决的方法。
3.为什么这样解决呢?
看下面:
在正常情况下,Firefox和google都可以使用而IE不可以使用,因为在IE中当java中response.setContentType("text/json"); 返回数据根本不走回调方法。
查看源代码发现:
因此就这java中返回数据时添加了<textarea></textarea>。
这样处理后发现在IE中可以了但是在其他浏览器中又不行了。
因此就写了个dataFilter做了处理这样就都可以了。
当然也可以直接写个dataFilter加上<textarea></textarea>,而不需要在java中添加。
但是这样没试过,理论上是可以的,有兴趣的可以自己看看。