最近需要做个图片上传的问题，先开始想用一些上传控件来做，但在参考相关资料后，觉得控件大部分都是采用Flash方式实现，在结合自定义方式实现时有很多不便（对源码不熟，sorry）， 所以打算用开源的jquery ajaxsubmit插件来做。
先说说准备工作吧:jjquery-1.6.4.min.js这个当然是必须的，jquery.form.js 这个就是你Ajax提交表单需要的。先贴上代码：
$("form").submit(function(){@H_502_5@ $(this).ajaxSubmit({@H_502_5@ type:'post',@H_502_5@ dataType:'text',//返回数据类型@H_502_5@ url:contextPath + '/catentry/picUpload.action',@H_502_5@ success:function(data){ //上传回调函数 我刚开始用的jquery版本是1.4版 结果执行回调函数@H_502_5@ window.returnValue = data;@H_502_5@ window.close();@H_502_5@ }@H_502_5@ });@H_502_5@ return false; //没设置这个 游览器会重新打开个窗口@H_502_5@ }); @H_502_5@ 下面看看后台action
/**@H_502_5@ * 商品图片上传@H_502_5@ * @H_502_5@ */@H_502_5@ public String picUpload(){@H_502_5@ try {@H_502_5@ if(picFile != null){@H_502_5@ InputStream isf = null;@H_502_5@ String name = picFileFileName;@H_502_5@ isf = new FileInputStream(picFile);@H_502_5@ String ftpServers = getConfigValue("ftp.sever","config.properties");@H_502_5@ // int ftpPort = Integer.parseInt(SupportGlobals.getProperty("ftp.port"));@H_502_5@ // String ftpUser = SupportGlobals.getProperty("ftp.user");@H_502_5@ // String ftpPassword = SupportGlobals.getProperty("ftp.password");@H_502_5@ // String mode = SupportGlobals.getProperty("ftp.mode");@H_502_5@ //ftp文件保存路径resource/emall/catentry + 月份@H_502_5@ int month = Calendar.getInstance().get(Calendar.MONTH) + 1;@H_502_5@ String monthStr = null;@H_502_5@ if(month <10){@H_502_5@ monthStr = "0" + String.valueOf(month);@H_502_5@ }else{@H_502_5@ monthStr = String.valueOf(month);@H_502_5@ }@H_502_5@ int year = Calendar.getInstance().get(Calendar.YEAR);@H_502_5@ StringBuffer savePath = new StringBuffer("resource/emall/catentry/").append(year).append(monthStr).append("/");@H_502_5@ //保存文件名 策略： 时间戳+8位随机数@H_502_5@ Long i = System.currentTimeMillis();@H_502_5@ Random random = new Random();@H_502_5@ int j = random.nextInt(10000000);@H_502_5@ String dot = name.substring(name.lastIndexOf(".")+1,name.length());@H_502_5@ String fileName = String.valueOf(i) + String.valueOf(j) + "." + dot;@H_502_5@ //保存ftp后获取ftp上面的路径@H_502_5@ StringBuffer backPath = new StringBuffer("http://").append(ftpServers)@H_502_5@ .append("/").append(savePath).append(fileName);@H_502_5@ @H_502_5@ FtpUtil.ftpUploadFile(isf,savePath.toString(),null,fileName);@H_502_5@ //this.writePlainText(true,backPath.toString());@H_502_5@ response.setCharacterEncoding("UTF-8");@H_502_5@ response.setContentType("text/plain");@H_502_5@ response.getWriter().print(backPath.toString());@H_502_5@ }@H_502_5@ return NONE;@H_502_5@ } catch (Exception e) {@H_502_5@ logger.error(e.getMessage(),e);@H_502_5@ return NONE;@H_502_5@ }@H_502_5@ }
@H_502_5@
@H_502_5@
这样就完成了一个图片Ajax上传功能。对于刚开始遇到的问题：suaccess不执行回调，个人觉得可能是jquery.form.js与jquery版本不一致导致。期间我也把jquery.form.js 版本换成了最新的。
