ajax如何实现文件异步上传并回显文件相关信息功能

这篇文章主要介绍了ajax如何实现文件异步上传并回显文件相关信息功能,具有一定借鉴价值,感兴趣的朋友可以参考下,希望大家阅读完这篇文章之后大有收获,下面让小编带着大家一起了解一下。

成都创新互联公司是一家专业提供阳泉企业网站建设,专注与做网站、网站制作、HTML5、小程序制作等业务。10年已为阳泉众多企业、政府机构等服务。创新互联专业网站制作公司优惠进行中。

具体如下:

上传文件的信息


  
  应用文件
     

ajax提交

$("#subm").click(function(){
    var formData = new FormData();
    formData.append("appFile", document.getElementById("appFile").files[0]);
    alert("8888888888888888888888888");
    $.ajax({
      url: '${ctx}/appresources/fileUpload.shtml',
      type: "POST",
      data: formData,
      dataType: "json",
      contentType: false,
      processData: false,
      success: function (data) {
        alert("上传成功");
        $("#versionCode").val(data.versionCode);
        $("#appVersion").val(data.appVersion);
        $("#appPackageName").val(data.appPackageName);
      },
      error: function () {
        alert("上传失败!");
      }
    });
});

后台处理:

@ResponseBody
@RequestMapping("fileUpload")
public JSONObject fileUpload(MultipartFile appFile,Model model,HttpServletRequest request,HttpServletResponse response) {
    ServletContext
//........................省略
    String infos=ApkUtil.getApkInfo(needPath+"source"+File.separator+"apk"+File.separator+fileName);
    String[] info=infos.split(",");
    String versionCode=info[0];//版本号
    String versionName=info[1];//版本名
    String packageName=info[2];//包名
    String appName=fileName;
    AppResourcesFormMap appResourcesFormMap = getFormMap(AppResourcesFormMap.class);
    appResourcesFormMap.put("appName",fileName);
    appResourcesFormMap.put("appVersion",versionName);
    appResourcesFormMap.put("appPackageName",packageName);
    appResourcesFormMap.put("versionCode", versionCode);
    System.out.println(appResourcesFormMap);
    //model.addAttribute("appresources", appResourcesFormMap);
    JSONObject fromObject = JSONObject.fromObject(appResourcesFormMap);
    //String string = fromObject.toString();
    return fromObject;
}

什么是ajax

ajax是一种在无需重新加载整个网页的情况下,能够更新部分网页的技术,可以通过在后台与服务器进行少量数据交换,使网页实现异步更新。

感谢你能够认真阅读完这篇文章,希望小编分享的“ajax如何实现文件异步上传并回显文件相关信息功能”这篇文章对大家有帮助,同时也希望大家多多支持创新互联,关注创新互联行业资讯频道,更多相关知识等着你来学习!


网站名称:ajax如何实现文件异步上传并回显文件相关信息功能
标题路径:http://abwzjs.com/article/pdepco.html

其他资讯