日期:2014-05-16  浏览次数:20814 次

jquery 插件ajaxupload 的简单应用
同事 一次需要ajax 上传某文件, 正好以前用过一种,叫ajaxupload,是jquery的一个插件. 于是几分钟帮同事搞定.代码如下:

    var button = $('#upload_button');  //定义能够上传文件的按钮,就是一个普通的button
    var fileType = "zip",fileNum = "one";   //定义能够上传的文件类型,当然要靠后面的onSubmit中的js去做判断
    new AjaxUpload(button,{
        action: '${ctp}/app/assistVerify/importShanghairReportAction.shtml',
        name: 'shanghaiFile',   //这相当于<input type = "file" name = "shanghaiFile"/>
        onSubmit : function(file, ext){
            if(fileType == "zip")
            {
                if (ext && /^(zip|rar)$/.test(ext)){
                    this.setData({
                        'info': '文件类型为压缩包' //这个info 暂时无效
                    });
                } else {
                    alert('非压缩包类型文件,请重传');
                    return false;               
                }
            }
                        
            button.text('导入上海资信中...');
            
            if(fileNum == 'one')  //同时上传的文件数不能超过一个
                this.disable();
            
        },
        onComplete: function(file, response){ //上传完毕后的操作
            if(response != "success")
                alert(response);
                
            button.text('导入上海资信');                        
            this.enable();
            
            if(response == "success");
                alert("导入上海资信成功");   

            //有了response我们能做任何事了,返回的文件名称,文件路径等我们可以随意操作的!
        }
    });



当然这些代码得靠 js 才能运行,请把上面的代码加在 $(document).ready的代码块中.同时请引入 ajaxupload.js,见附件下载!

1 楼 chxiaowu 2011-12-14  
有前台代码就 完美了。。