这里就简单介绍下ajaxFileUpload，jQuery插件AjaxFileUpload可以实现ajax文件上传。我们的项目采用的是jsp跟js分离的架构，所以代码如下。

首先是jsp部分：

<!-- <form method="post"> --> 
    <input type="file" name="n_file" id="fileToUpload" value="上传表格" /> 
     <button id="upload1" class="btn btn-default">上传</button> 
<!-- </form> --> 

这里说下 为什么把form注释了，因为我的jsp中已经有了另外一个form 在调试过程中发现可能有冲突就把form注释了，事实证明ajaxFileUpload 不用form表单一样可以提交，下面就是js代码部分：

$(function(){  
  //点击打开文件选择器  
  $("#upload1").on('click', function() {  
    //选择文件之后执行上传  
 
    $.ajaxFileUpload({  
      url:'supplyDataReportUploadExcel', //url自己写  
      secureuri:false, //这个是啥没啥用 
      type:'post', 
      fileElementId:'fileToUpload',//file标签的id  
      dataType: 'json',//返回数据的类型  
      //data:{name:'logan'},//一同上传的数据  
      success: function (data, status) {  
//       alert(data); 
//       alert(data.msg);   
//       alert(data.success); 
        if(data.success){ 
          alert("upload,success!!!"); 
          window.location.href='supplyDataReport'; 
        }else{ 
          alert(data.msg); 
          window.location.href='supplyDataReport'; 
        } 
         
      }/*,  
      error: function (data, status, e) {  
        alert(e);  
      }*/  
    });  
 
  });  
 
});  

本人js不好，只是会用这个js不能完全copy走，要结合项目结构的实际情况，不过大体参数干什么的注释都写了。一定注意type是post跟请求对应的Controller的方法的method=RequestMethod.POST 一致。注意dataType:'json'  ,一定注意json的大小写。

ps：这里要说一下我用的data.success做的判断跟后面的一个实体类AjaxJson有关系，注意！！！！！

对了 jsp中还需要引入 对应的js如下：

<script type="text/javascript">Core.js('./js/iface/upload');</script> 
<script type="text/javascript" src="libs/jquery/ajaxfileupload.js"></script> 

第一段引入的upload 就是上面js的内容，我们的引入js已经被封装好了，所以直接写那就行，具体结合实际情况 ，下面的要用到的jQuery插件AjaxFileUpload的js文件。

接下来是Controller方法如何相应：

@SuppressWarnings("resource") 
@RequestMapping(value = "/supplyDataReportUploadExcel", method = RequestMethod.POST) 
public @ResponseBody String supplyDataReportUploadExcel(HttpServletRequest request, HttpServletResponse response,MultipartFile n_file) throws Exception { 
  AjaxJson json = new AjaxJson(); 
  ObjectMapper mapper = new ObjectMapper(); 
  UploadFormBackVo uploadFormBackVo = new UploadFormBackVo(); 
  //判断是否是空的Excel 包括没有标题 
  if(n_file.getSize()>0){ 
    try{ 
      //先判断 文件名 是否符合规格 因为不知道怎么获取上传文件的路径 后期修改 
      //获取文件 
      //验证文件名 
      String fileName = n_file.getOriginalFilename(); 
      String fileNewName = fileName.replaceAll(".xls", ""); 
      String eL = "[a-zA-Z]+[0-9]{4}-[0-9]{2}-[0-9]{2}"; 
      Pattern p = Pattern.compile(eL); 
      Matcher m = p.matcher(fileNewName); 
      boolean dateFlag = m.matches(); 
      if (!dateFlag) { 
        System.out.println("格式错误"); 
        uploadFormBackVo.setFormName(n_file.getOriginalFilename()); 
        uploadFormBackVo.setUploadTime(new Date()); 
        uploadFormBackVo.setIfsuccess("上传失败，Excel文件名不符合规格！！！"); 
        supplyDataReportService.insert(uploadFormBackVo); 
         
        json.setSuccess(false); 
        json.setMsg("Excel,NameError!!!"); 
        String jsonStr = mapper.writeValueAsString(json); 
        return jsonStr; 
      } 
      //上传文件 
      UploadUtil.SaveFileFromInputStream(n_file.getInputStream(), "D:/补数据报表文件", n_file.getOriginalFilename()); 
      InputStream is2 = new FileInputStream("D:/补数据报表文件/"+n_file.getOriginalFilename()); 
       
      //读取文件进行内容验证 
      ExcelReader excelReader = new ExcelReader(); 
       
      Map<Integer, SupplyDataReportBackVo> supplyDataReportBackVos = new HashMap<Integer, SupplyDataReportBackVo>(); 
       
       
      String jsonStr = excelReader.readExcelContent(is2,supplyDataReportBackVos,json,n_file); 
      //判断 readExcelContent()解析Excel文件 是否符合规范 如果符合 修改相应数据  
      if(json.isSuccess()==true){ 
         //遍历map 用value --》SupplyDataReportBackVo 调用  updateById方法 
        for(SupplyDataReportBackVo supplyDataReportBackVo : supplyDataReportBackVos.values()){ 
          supplyDataReportService.updateById(supplyDataReportBackVo); 
        } 
         
        System.out.println("获得Excel表格的内容:"); 
        for (int i = 1; i <= supplyDataReportBackVos.size(); i++) { 
           
          System.out.println(supplyDataReportBackVos.get(i)); 
        } 
        //保存上传记录 
        uploadFormBackVo.setFormName(n_file.getOriginalFilename()); 
        uploadFormBackVo.setUploadTime(new Date()); 
        uploadFormBackVo.setIfsuccess("上传成功"); 
        supplyDataReportService.insert(uploadFormBackVo); 
        return jsonStr; 
      } 
      // 解析Excel 文件 中  有空值 保存这次上传的记录且删除已上传的Excel文件， 删除已上传的Excel文件已在 readExcelContent()中处理 
      uploadFormBackVo.setFormName(n_file.getOriginalFilename()); 
      uploadFormBackVo.setUploadTime(new Date()); 
      uploadFormBackVo.setIfsuccess("上传失败，Excel中有空值！！！"); 
      supplyDataReportService.insert(uploadFormBackVo); 
      return jsonStr; 
    } catch (IOException e){ 
      System.out.println(e.getMessage()); 
    } 
  }else{ 
    //ajax返回的数据 
    json.setSuccess(false); 
    json.setMsg("Upload File Null!!!!!"); 
    String jsonStr = mapper.writeValueAsString(json); 
    return jsonStr; 
  } 
  System.out.println("ajax请求成功"); 
  return ""; 
   
/    json.setMsg("upload,success!!!"); 
   
} 

这个方法注意几个地方就行，其他的都是楼主本人自身的业务逻辑，第一@RequestMapping中请求的方式为POST，第二传入的参数有个MultipartFile  n_file，这个n_file要跟jsp中的<input>标签中name属性对应。第三要注意返回值Sting上的一个注解@ResponseBody，剩下两个需要注意的地方就是AjaxJson，ObjectMapper。

AjaxJson是自己封装的一个model类，用来处理ajax的，至于ObjectMapper是用来转换类型的具体的自己百度或者脑补吧，楼主也紧紧限于会用。下面贴上AjaxJson：

package com.zhongxin.web.ops.adrule.model; 
 
import java.util.Map; 
 
public class AjaxJson { 
   
  private boolean success = true; 
   
  private String msg = "ok"; 
   
  private Object obj = null; 
   
  private Map<String, Object> attributes; 
   
  public boolean isSuccess() { 
    return success; 
  } 
  public void setSuccess(boolean success) { 
    this.success = success; 
  } 
  public String getMsg() { 
    return msg; 
  } 
  public void setMsg(String msg) { 
    this.msg = msg; 
  } 
  public Object getObj() { 
    return obj; 
  } 
  public void setObj(Object obj) { 
    this.obj = obj; 
  } 
  public Map<String, Object> getAttributes() { 
    return attributes; 
  } 
  public void setAttributes(Map<String, Object> attributes) { 
    this.attributes = attributes; 
  } 
   
} 

这就是一个简单的ajaxFileUpload 使用流程，欢迎探讨！也希望大家多多支持。

# ajaxfileupload  # 异步  # ajax  # 异步上传文件  # fileupload  # 异步上传  # jquery的ajaxSubmit()异步上传图片并保存表单数据演示代码  # jQuery插件ajaxFileUpload异步上传文件  # jquery之ajaxfileupload异步上传插件(附工程代码)  # ajax图片上传  # 图片异步上传  # 更新实例  # php+ajax实现异步上传文件或图片功能  # jQuery插件ajaxFileUpload实现异步上传文件效果  # asp.net+ajaxfileupload.js 实现文件异步上传代码分享  # JQuery插件ajaxfileupload.js异步上传文件实例  # Ajax异步上传文件实例代码分享  # ASP.NET中MVC使用AJAX调用JsonResult方法并返回自定义错误信息  # ajax实现文件异步上传并回显文件相关信息功能示例  # 上传  # 就行  # 实际情况  # 会用  # 是否符合  # 上传文件  # 的是  # 都是  # 是一个  # 几个  # 好了  # 有个  # 遍历  # 其他的  # 这就  # 我用  # 要注意  # 就把  # 要用  # 能有 

相关栏目： 【 网站优化151355 】 【 网络推广146373 】 【 网络技术251813 】 【 AI营销90571 】

相关推荐： 品牌网站制作公司有哪些,买正品品牌一般去哪个网站买？  Laravel Eloquent：优雅地将关联模型字段扁平化到主模型中  在线教育网站制作平台,山西立德教育官网？  Laravel如何实现邮件验证激活账户_Laravel内置MustVerifyEmail接口配置【步骤】  如何在VPS电脑上快速搭建网站？  如何用PHP快速搭建CMS系统？  Python函数文档自动校验_规范解析【教程】  如何快速搭建高效可靠的建站解决方案？  网站视频制作书签怎么做,ie浏览器怎么将网站固定在书签工具栏？  Laravel怎么在Blade中安全地输出原始HTML内容  JavaScript 输出显示内容(document.write、alert、innerHTML、console.log)  Laravel怎么发送邮件_Laravel Mail类SMTP配置教程  香港服务器网站推广：SEO优化与外贸独立站搭建策略  Laravel怎么使用Collection集合方法_Laravel数组操作高级函数pluck与map【手册】  jquery插件bootstrapValidator表单验证详解  Laravel观察者模式如何使用_Laravel Model Observer配置  HTML透明颜色代码在Angular里怎么设置_Angular透明颜色使用指南【详解】  Laravel如何实现用户角色和权限系统_Laravel角色权限管理机制  Linux系统命令中screen命令详解  Midjourney怎样加参数调细节_Midjourney参数调整技巧【指南】  如何在IIS中新建站点并配置端口与物理路径？  高端智能建站公司优选：品牌定制与SEO优化一站式服务  Laravel如何实现全文搜索功能？（Scout和Algolia示例）  linux top下的 minerd 木马清除方法  谷歌Google入口永久地址_Google搜索引擎官网首页永久入口  如何用西部建站助手快速创建专业网站？  如何快速生成ASP一键建站模板并优化安全性？  5种Android数据存储方式汇总  javascript基本数据类型及类型检测常用方法小结  Win11怎么设置默认图片查看器_Windows11照片应用关联设置  如何用已有域名快速搭建网站？  javascript基于原型链的继承及call和apply函数用法分析  浅谈javascript alert和confirm的美化  Laravel如何配置任务调度？（Cron Job示例）  教你用AI将一段旋律扩展成一首完整的曲子  如何在企业微信快速生成手机电脑官网？  网站制作公司哪里好做,成都网站制作公司哪家做得比较好，更正规？  利用 Google AI 进行 YouTube 视频 SEO 描述优化  如何快速上传建站程序避免常见错误？  如何在阿里云ECS服务器部署织梦CMS网站？  如何挑选最适合建站的高性能VPS主机？  如何快速搭建二级域名独立网站？  Laravel中的withCount方法怎么高效统计关联模型数量  html文件怎么打开证书错误_https协议的html打开提示不安全【指南】  利用vue写todolist单页应用  Linux网络带宽限制_tc配置实践解析【教程】  Laravel如何实现URL美化Slug功能_Laravel使用eloquent-sluggable生成别名【方法】  JavaScript如何实现路由_前端路由原理是什么  ai格式如何转html_将AI设计稿转换为HTML页面流程【页面】  QQ浏览器网页版登录入口 个人中心在线进入