struts2,Jquery uploadify异步上传文件

文件异步上传不能使用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>

struts2,Jquery uploadify异步上传文件

上一篇:[Mugeda HTML5技术教程之10]发布内容


下一篇:c# datetime 格式化