Ext.Ajax.request做文件上传不执行回调函数?

我在做一个多文件上传,整体用的EXT,所以想用EXT的异步请求完成上传,上传没问题,就是上传完了,不执行回调函数,老自动弹一个下载"uploadFile.action"文件,其实就是一个json,好像是根本没执行回调函数,求各位老鸟解释下,并帮我解决,我不想别人上传完,总提示下载"uploadFile.action"。
页面代码:
[code="java"]

上传附件
添加附件:
文件路径
温馨提示:最多可同时上传 个文件,只允许上传 文件。
   

<br> //以下为附件js代码<br> var isIE = (document.all) ? true : false;</p> <p>var $ = function (id) {<br> return &quot;string&quot; == typeof id ? document.getElementById(id) : id;<br> };</p> <p>var Class = {<br> create: function() {<br> return function() {<br> this.initialize.apply(this, arguments);<br> }<br> }<br> }</p> <p>var Extend = function(destination, source) {<br> for (var property in source) {<br> destination[property] = source[property];<br> }<br> }</p> <p>var Bind = function(object, fun) {<br> return function() {<br> return fun.apply(object, arguments);<br> }<br> }</p> <p>var Each = function(list, fun){<br> for (var i = 0, len = list.length; i &lt; len; i++) { fun(list[i], i); }<br> };</p> <p>//提交操作<br> function doUpload(){<br> if(Efs.getExt(&quot;uploadForm&quot;).isValid()){<br> myMask.show();<br> Ext.Ajax.request({<br><br> //请求地址<br><br> url: &#39;uploadFile.action&#39;,<br><br> //提交参数组<br><br> fileUpload: true,<br> form: uploadForm,<br> scope: uploadForm,<br><br> //成功时回调<br><br> success: function(response, options) {<br><br> //获取响应的json字符串<br><br> myMask.hide();<br> var json = response.responseText; <br> var o= Ext.util.JSON.decode(json);<br><br> // var s=&quot;<s:text name="o.msg"/>&quot;;<br><br> var s=o.msg;<br><br> Ext.Msg.alert(&#39;<s:text name="msg_title"/>&#39;, s);<br><br> },<br> failure: function (response,options){<br> myMask.hide();<br> var st=&#39;<s:text name="'+o.msg+'"/>&#39;;<br><br> Ext.Msg.alert(&#39;<s:text name="msg_title"/>&#39;, st); <br> }<br><br> }); <br> }<br> else<br> Ext.Msg.alert(&#39;<s:text name="msg_title"/>&#39;, &#39;<s:text name="msg_mustFill"/>&#39;);<br> }</p> <p>//文件上传<br> var FileUpload = Class.create();<br> FileUpload.prototype = {<br> //表单对象,文件控件存放空间<br> initialize: function(form, folder, options) {</p> <pre><code>this.Form = $(form);//表单 this.Folder = $(folder);//文件控件存放空间 this.Files = [];//文件集合 this.SetOptions(options); this.FileName = this.options.FileName; this._FrameName = this.options.FrameName; this.Limit = this.options.Limit; this.Distinct = !!this.options.Distinct; this.ExtIn = this.options.ExtIn; this.ExtOut = this.options.ExtOut; this.onIniFile = this.options.onIniFile; this.onEmpty = this.options.onEmpty; this.onNotExtIn = this.options.onNotExtIn; this.onExtOut = this.options.onExtOut; this.onLimite = this.options.onLimite; this.onSame = this.options.onSame; this.onFail = this.options.onFail; this.onIni = this.options.onIni; if(!this._FrameName){ //为每个实例创建不同的iframe this._FrameName = &quot;uploadFrame_&quot; + Math.floor(Math.random() * 1000); //ie不能修改iframe的name var oFrame = isIE ? document.createElement(&quot;&lt;iframe name=\&quot;&quot; + this._FrameName + &quot;\&quot;&gt;&quot;) : document.createElement(&quot;iframe&quot;); //为ff设置name oFrame.name = this._FrameName; oFrame.style.display = &quot;none&quot;; //在ie文档未加载完用appendChild会报错 document.body.insertBefore(oFrame, document.body.childNodes[0]); } //设置form属性,关键是target要指向iframe this.Form.target = this._FrameName; this.Form.method = &quot;post&quot;; //注意ie的form没有enctype属性,要用encoding this.Form.encoding = &quot;multipart/form-data&quot;; //整理一次 this.Ini(); </code></pre> <p>},<br> //设置默认属性<br> SetOptions: function(options) {<br> this.options = {//默认值<br> FileName: &quot;files&quot;,//文件上传控件的name,配合后台使用<br> FrameName: &quot;&quot;,//iframe的name,要自定义iframe的话这里设置name<br> onIniFile: function(){},//整理文件时执行(其中参数是file对象)<br> onEmpty: function(){},//文件空值时执行<br> Limit: 0,//文件数限制,0为不限制<br> onLimite: function(){},//超过文件数限制时执行<br> Distinct: true,//是否不允许相同文件<br> onSame: function(){},//有相同文件时执行<br> ExtIn: [],//允许后缀名<br> onNotExtIn: function(){},//不是允许后缀名时执行<br> ExtOut: [],//禁止后缀名,当设置了ExtIn则ExtOut无效<br> onExtOut: function(){},//是禁止后缀名时执行<br> onFail: function(){},//文件不通过检测时执行(其中参数是file对象)<br> onIni: function(){}//重置时执行<br> };<br> Extend(this.options, options || {});<br> },<br> //整理空间<br> Ini: function() {<br> //整理文件集合<br> this.Files = [];<br> //整理文件空间,把有值的file放入文件集合<br> Each(this.Folder.getElementsByTagName(&quot;input&quot;), Bind(this, function(o){<br> if(o.type == &quot;file&quot;){ o.value &amp;&amp; this.Files.push(o); this.onIniFile(o); }<br> }))<br> //插入一个新的file<br> var file = document.createElement(&quot;input&quot;);<br> file.name = this.FileName; file.type = &quot;file&quot;; file.onchange = Bind(this, function(){ this.Check(file); this.Ini(); });<br> this.Folder.appendChild(file);<br> //执行附加程序<br> this.onIni();<br> //添加附件成功,显示列表<br> if(this.Files.length&gt;0){<br> document.getElementById(&#39;fileList&#39;).style.display=&quot;&quot;;<br> document.getElementById(&#39;uploadButton&#39;).style.display=&quot;&quot;;<br> }<br> },<br> //检测file对象<br> Check: function(file) {<br> //检测变量<br> var bCheck = true;<br> //空值、文件数限制、后缀名、相同文件检测<br> if(!file.value){<br> bCheck = false; this.onEmpty();<br> } else if(this.Limit &amp;&amp; this.Files.length &gt;= this.Limit){<br> bCheck = false; this.onLimite();<br> } else if(!!this.ExtIn.length &amp;&amp; !RegExp(&quot;.(&quot; + this.ExtIn.join(&quot;|&quot;) + &quot;)$&quot;, &quot;i&quot;).test(file.value)){<br> //检测是否允许后缀名<br> bCheck = false; this.onNotExtIn();<br> } else if(!!this.ExtOut.length &amp;&amp; RegExp(&quot;.(&quot; + this.ExtOut.join(&quot;|&quot;) + &quot;)$&quot;, &quot;i&quot;).test(file.value)) {<br> //检测是否禁止后缀名<br> bCheck = false; this.onExtOut();<br> } else if(!!this.Distinct) {<br> Each(this.Files, function(o){ if(o.value == file.value){ bCheck = false; } })<br> if(!bCheck){ this.onSame(); }<br> }<br> //没有通过检测<br> !bCheck &amp;&amp; this.onFail(file);<br> },<br> //删除指定file<br> Delete: function(file) {<br> //移除指定file<br> this.Folder.removeChild(file); this.Ini();<br> if(this.Folder.getElementsByTagName(&quot;input&quot;).length==1){//没有附件时隐藏<br> document.getElementById(&#39;fileList&#39;).style.display=&quot;none&quot;;<br> document.getElementById(&#39;uploadButton&#39;).style.display=&quot;none&quot;;<br> }<br> },<br> //删除全部file<br> Clear: function() {<br> //清空文件空间<br> Each(this.Files, Bind(this, function(o){ this.Folder.removeChild(o); })); this.Ini();<br> document.getElementById(&#39;fileList&#39;).style.display=&quot;none&quot;;//清空同样隐藏<br> document.getElementById(&#39;uploadButton&#39;).style.display=&quot;none&quot;;<br> }<br> }</p> <p>var fu = new FileUpload(&quot;uploadForm&quot;, &quot;idFile&quot;, { Limit: 3, ExtIn: [],<br> onIniFile: function(file){ file.value ? file.style.display = &quot;none&quot; : this.Folder.removeChild(file); },<br> onEmpty: function(){ alert(&quot;请选择一个文件&quot;); },<br> onLimite: function(){ alert(&quot;超过上传限制&quot;); },<br> onSame: function(){ alert(&quot;已经有相同文件&quot;); },<br> // ExtIn: [&quot;jpg&quot;, &quot;gif&quot;] 可以限制上传文件后缀名,不写即为所有<br> // onNotExtIn: function(){ alert(&quot;只允许上传&quot; + this.ExtIn.join(&quot;,&quot;) + &quot;文件&quot;); },<br> onFail: function(file){ this.Folder.removeChild(file); },<br> onIni: function(){<br> //显示文件列表<br> var arrRows = [];<br> if(this.Files.length){<br> var oThis = this;<br> Each(this.Files, function(o){<br> var a = document.createElement(&quot;a&quot;); a.innerHTML = &quot;取消&quot;; a.href = &quot;javascript:void(0);&quot;;<br> a.onclick = function(){ oThis.Delete(o); return false; };<br> arrRows.push([o.value, a]);<br> });<br> } else { <br> arrRows.push([&quot;<font color='gray'>没有添加文件</font>&quot;, &quot;&nbsp;&quot;]); <br> }<br> AddList(arrRows);</p> <pre><code> //设置按钮 //$(&quot;idBtnupload&quot;).disabled = $(&quot;idBtndel&quot;).disabled = this.Files.length &lt;= 0; } </code></pre> <p>});</p> <p>$(&quot;idBtnupload&quot;).onclick = function(){<br> //显示文件列表<br> var arrRows = [];<br> Each(fu.Files, function(o){ arrRows.push([o.value, &quot;&nbsp;&quot;]); });<br> AddList(arrRows);</p> <pre><code>fu.Folder.style.display = &quot;none&quot;; $(&quot;idProcess&quot;).style.display = &quot;&quot;; $(&quot;idMsg&quot;).innerHTML = &quot;正在添加文件到您的网盘中,请稍候……&lt;br /&gt;有可能因为网络问题,出现程序长时间无响应,请点击“&lt;a href=&#39;?&#39;&gt;&lt;font color=&#39;red&#39;&gt;取消&lt;/font&gt;&lt;/a&gt;”重新上传文件&quot;; doUpload(); $(&quot;idProcess&quot;).style.display = &quot;none&quot;; //fu.Form.submit(); </code></pre> <p>}</p> <p>//用来添加文件列表的函数<br> function AddList(rows){<br> //根据数组来添加列表<br> var FileList = $(&quot;idFileList&quot;), oFragment = document.createDocumentFragment();<br> //用文档碎片保存列表<br> Each(rows, function(cells){<br> var row = document.createElement(&quot;tr&quot;);<br> Each(cells, function(o){<br> var cell = document.createElement(&quot;td&quot;);<br> if(typeof o == &quot;string&quot;){ cell.innerHTML = o; }else{ cell.appendChild(o); }<br> row.appendChild(cell);<br> });<br> oFragment.appendChild(row);<br> })<br> //ie的table不支持innerHTML所以这样清空table<br> while(FileList.hasChildNodes()){ FileList.removeChild(FileList.firstChild); }<br> FileList.appendChild(oFragment);<br> }</p> <p>$(&quot;idLimit&quot;).innerHTML = fu.Limit;</p> <p>$(&quot;idExt&quot;).innerHTML = fu.ExtIn.join(&quot;,&quot;);</p> <p>$(&quot;idBtndel&quot;).onclick = function(){ fu.Clear(); }</p> <p>//在后台通过window.parent来访问主页面的函数<br> //function Finish(msg){ alert(msg); location.href = location.href; }<br> <SCRIPT><br> [/code]</p> <p>struts配置文件(用的插件自动生成json):<br> [code=&quot;java&quot;]<br> <action name="*File" method="{1}" class="com.web.action.UploadFile"><br> <result type="json" name="success"><br> <param name="includeProperties">msg</param><br> <param name="excludeNullProperties">true</param><br> </result><br> <result type="json" name="error"><br> <param name="includeProperties">msg</param><br> <param name="excludeNullProperties">true</param><br> </result><br> </action><br> [/code]</p> <p>后台UploadFile.java的代码<br> [code=&quot;java&quot;]<br> package com.web.action;</p> <p>import java.io.BufferedInputStream;<br> import java.io.BufferedOutputStream;<br> import java.io.File;<br> import java.io.FileInputStream;<br> import java.io.FileOutputStream;<br> import java.io.IOException;<br> import java.util.Map;</p> <p>import javax.servlet.http.HttpServletRequest;</p> <p>import org.apache.struts2.ServletActionContext;</p> <p>import com.common.pojo.AppUser;<br> import com.opensymphony.xwork2.ActionContext;</p> <p>/**</p> <ul> <li><p>负责文件的上传<br> */<br> public class UploadFile {<br> private File[] files;<br> private String[] filesFileName;<br> private Map<String, String> filesPath;// 文件名及其上传后路径<br> private String msg;</p> <p>public String upload() {<br> /*<br> * Map session=ActionContext.getContext().getSession(); AppUser<br> * user=(AppUser) session.get(&quot;user&quot;); if(user==null){ return &quot;error&quot;; }<br> */<br> msg=&quot;上传成功!&quot;;<br> for (int i = 0; i &lt; files.length; i++) {<br> fileCopy(files[i], filesFileName[i]);<br> }<br> return &quot;success&quot;;<br> }</p> <p>private void fileCopy(File file, String fileName) {<br> BufferedInputStream bis = null;<br> BufferedOutputStream bos = null;<br> String realPath = ServletActionContext.<br> getServletContext().getRealPath(&quot;/upload/&quot; + fileName);<br> System.out.println(realPath);<br> try {<br> bis = new BufferedInputStream(new FileInputStream(file));<br> bos = new BufferedOutputStream(new FileOutputStream(new File(<br> realPath)));<br> byte[] buffer = new byte[1024 * 8];<br> int i = -1;<br> while ((i = bis.read(buffer)) != -1) {<br> bos.write(buffer,0,i);<br> }<br> bos.flush();<br> } catch (Exception e) {<br> System.out.println(&quot;上传异常!&quot;);<br> msg=&quot;上传出错!&quot;;<br> e.printStackTrace();<br> }finally{<br> try {<br> if (bis != null)<br> bis.close();<br> if (bos != null)<br> bos.close();<br> } catch (IOException e1) {<br> System.out.println(&quot;上传结束异常!&quot;);<br> e1.printStackTrace();<br> }<br> }<br> }</p> <p>public File[] getFiles() {<br> return files;<br> }</p> <p>public void setFiles(File[] files) {<br> this.files = files;<br> }</p> <p>public String[] getFilesFileName() {<br> return filesFileName;<br> }</p> <p>public void setFilesFileName(String[] filesFileName) {<br> this.filesFileName = filesFileName;<br> }</p> <p>public String getMsg() {<br> return msg;<br> }</p> <p>public void setMsg(String msg) {<br> this.msg = msg;<br> }<br> }<br> [/code]</p></li> </ul>

1个回答

设置json 插件头文件


msg

text/html;charset=UTF-8
true





msg

text/html;charset=UTF-8
true



或者使用
ServletActionContext.getResponse().getWriter().write("{msg:'测试消息'}");

Csdn user default icon
上传中...
上传图片
插入图片
抄袭、复制答案,以达到刷声望分或其他目的的行为,在CSDN问答是严格禁止的,一经发现立刻封号。是时候展现真正的技术了!