600字范文,内容丰富有趣,生活中的好帮手!
600字范文 > 文件上传之二利用frame实现无页面刷新的文件上传

文件上传之二利用frame实现无页面刷新的文件上传

时间:2020-05-10 10:12:08

相关推荐

文件上传之二利用frame实现无页面刷新的文件上传

在上一篇文章中是将文件随表单中其他数据一起提交的,这样在提交一个表单时需要较长的时间,用户体验不是很好。一般网站选择将文件与表单的其他数据分开而单独上传。本文介绍如何利用iframe标签将上传文件模块嵌套在表单中,实现无页面刷新的文件上传。

表单页面

<%@pagelanguage="java"contentType="text/html;charset=UTF-8"pageEncoding="UTF-8"%><!DOCTYPE><html><head><metahttp-equiv="Content-Type"content="text/html;charset=UTF-8"><title>Inserttitlehere</title></head><body><div><div><h3>Frame嵌套的方式上传文件</h3></div><div><formaction=""method="post"><div><span>文件名:</span><inputtype="text"name="filename"/></div><div><iframesrc="FrameFileUpload.jsp"></iframe></div><div><inputtype="submit"value="提交"/></div></form></div></div></body></html>

文件上传页面(通过iframe嵌套在表单页面)

<%@pagelanguage="java"contentType="text/html;charset=UTF-8"pageEncoding="UTF-8"%><!DOCTYPE><html><head><metahttp-equiv="Content-Type"content="text/html;charset=UTF-8"><title>FileUpload</title></head><body><div><formaction="frameFileLoadAction"enctype="multipart/form-data"method="post"><div><inputtype="file"name="file"id="file_upload"/></div><div><inputtype="submit"value="上传"/></div></form></div><div><span>上传结果:</span><span><%StringisSuccess=request.getParameter("isSuccess");if("1".equals(isSuccess)){out.print("上传成功");}elseif("0".equals(isSuccess)){out.print("上传失败");}else{out.print("还没有上传文件");}%></span></div></body></html>

struts2配置文件

<?xmlversion="1.0"encoding="UTF-8"?><!DOCTYPEstrutsPUBLIC"-//ApacheSoftwareFoundation//DTDStrutsConfiguration2.3//EN""/dtds/struts-2.3.dtd"><struts><constantname="struts.devMode"value="true"/><constantname="struts.i18n.encoding"value="UTF-8"/><constantname="struts.ui.theme"value="simple"/><constantname="struts.multipart.maxSize"value="100"/><constantname="struts.multipart.saveDir"value="c:/tmp"/><packagename="fileUpload"extends="struts-default"namespace="/"><actionname="frameFileLoadAction"class="com.study.action.FileUploadAction"method="execute"><paramname="filePath">/filetemp</param><resultname="success">/FrameFileUpload.jsp?isSuccess=1</result><resultname="input">/FrameFileUpload.jsp?isSuccess=0</result></action></package></struts>

Struts2的Action

packagecom.study.action;importjava.io.File;importorg.apache.struts2.ServletActionContext;importcom.opensymphony.xwork2.ActionSupport;importcom.study.util.FileCopyUtil;publicclassFileUploadActionextendsActionSupport{protectedFilefile;protectedStringfileFileName;protectedStringfileContentType;protectedStringfilePath;protectedvoidrestoreFile()throwsException{if(this.file!=null){Filetemp=newFile(ServletActionContext.getServletContext().getRealPath(this.filePath)+"/"+this.fileFileName);FileCopyUtil.copy(this.file,temp);}}@OverridepublicStringexecute()throwsException{this.restoreFile();return"success";}publicFilegetFile(){returnfile;}publicvoidsetFile(Filefile){this.file=file;}publicStringgetFileFileName(){returnfileFileName;}publicvoidsetFileFileName(StringfileFileName){this.fileFileName=fileFileName;}publicStringgetFileContentType(){returnfileContentType;}publicvoidsetFileContentType(StringfileContentType){this.fileContentType=fileContentType;}publicStringgetFilePath(){returnfilePath;}publicvoidsetFilePath(StringfilePath){this.filePath=filePath;}}

总结:通过iframe嵌套文件上传页面,从而将文件上传与其他数据分开提交。其实刷新的是iframe。但这样整个页面不会刷新,给用户的感觉更好。

PS:上传文件后可以将文件的存储位置返回并放在表单中与其他数据一块上传。

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。