文件异步上传不能使用ajax,因为ajax只能上传文本信息,这里使用uploadify。
1、在官网http://www.uploadify.com下载uploadify,它有两个版本,Flash版本和HTML5版本,这里我们用Flash版本,文件很小,只有49K。
2、新建文件夹uploadify,把uploadify.zip解压到里面(因为其解压出来没有放在一个文件夹中,建议新建文件夹),然后把装有解压后文件的文件夹放在Webcontent目录下。
3、在JSP页面写入上传文件代码:
<input type="file" id="personalInfoUpload"/>使用uploadify:
<script type="text/javascript" src="<%=path%>/JS/jquery_1.7.2.js"></script><!--引入Jquery--> <link rel="stylesheet" type="text/css" href="<%=path %>/uploadify/uploadify.css" /><!--引入uploadify样式--> <script type="text/javascript" src="<%=path %>/uploadify/jquery.uploadify.js"></script><!--引入jquery.uploadify.js--> <script type="text/javascript"> $(function() {//等同于$(document).ready(function(){});说明此函数在页面加载完后被调用 $("#personalInfoUpload").uploadify({ buttonText: ‘上传头像‘,// 按钮的显示文本 height : 25,//按钮高度30 swf : ‘<%=path%>/uploadify/uploadify.swf‘,//起到提交文件作用的flash uploader : ‘<%=path%>/WithView/upload‘,//异步提交的后台路径(action的路径) width : 150,//按钮的宽120 fileSizeLimit: ‘2048KB‘,// 上传文件的最大限制 onUploadSuccess:function(path){//上传成功的回调方法 } }); }); </script>uploadify的选项可参考:http://blog.csdn.net/wintersweetsugar/article/details/18360501
4、action方法
public class PersonalInfo { private File filedata;// 上传的文件(此名称默认,如想修改请修改uploadify的fileObjName选项) private String filedataFileName;// 上传的文件名 private String filedataContentType;// 上传文件类型的属性 public File getFiledata() { return filedata; } public void setFiledata(File filedata) { this.filedata = filedata; } public String getFiledataFileName() { return filedataFileName; } public void setFiledataFileName(String filedataFileName) { this.filedataFileName = filedataFileName; } public String getFiledataContentType() { return filedataContentType; } public void setFiledataContentType(String filedataContentType) { this.filedataContentType = filedataContentType; } /** * 上传文件 * @throws IOException * * @since 2014-1-16 */ public void uploadFile() throws IOException { // 如果有文件 if (filedata != null) { // 创建存放路径 String filePathDir = "D:\\EclipseWorkspace\\With\\WebContent\\IMAGE"//需用双反斜杠‘\\‘ //根据路径创建文件夹对象 File importSaveFile=new File(filePathDir); if(!importSaveFile.exists()){ importSaveFile.mkdirs();//如果目录不存在就创建 } //文件名+后缀 String saveFileName="唯一文件名"+"."+FilenameUtils.getExtension(filedataFileName); File tarFile=new File(filePathDir+"//"+saveFileName); FileUtils.copyFile(filedata, tarFile); } } }
5、struts.xml配置
<package name="personalInfo" namespace="/WithView" extends="struts-default"> <action name="upload" class="com.flowers.with.controler.PersonalInfo" method="uploadFile"></action> </package>