ajax實(shí)現(xiàn)文件異步上傳并回顯文件相關(guān)信息功能示例

更新時(shí)間：2018年06月25日 15:09:28 作者：一個(gè)小小小碼農(nóng)

這篇文章主要介紹了ajax實(shí)現(xiàn)文件異步上傳并回顯文件相關(guān)信息功能,結(jié)合實(shí)例形式分析了基于jQuery $.ajax方法的文件異步上傳以及后臺(tái)java程序?qū)ξ募畔⒌淖x取與顯示相關(guān)操作技巧,需要的朋友可以參考下

本文實(shí)例講述了ajax實(shí)現(xiàn)文件異步上傳并回顯文件相關(guān)信息功能。分享給大家供大家參考，具體如下：

上傳文件的信息

<div class="form-group">
  <div class="col-sm-4">
  <label class="control-label">應(yīng)用文件</label>
</div>
<div class="col-sm-8">
  <input type="file" name="appFile" id="appFile">
  <input type="submit" value="確認(rèn)上傳" id="subm">
</div>

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("上傳失敗！");
      }
    });
});

后臺(tái)處理：

@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];//版本號(hào)
    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;
}

更多關(guān)于ajax相關(guān)內(nèi)容感興趣的讀者可查看本站專題：《jquery中Ajax用法總結(jié)》、《JavaScript中ajax操作技巧總結(jié)》、《PHP+ajax技巧與應(yīng)用小結(jié)》及《asp.net ajax技巧總結(jié)專題》

希望本文所述對(duì)大家ajax程序設(shè)計(jì)有所幫助。

您可能感興趣的文章: