ajax上传数据

---恢复内容开始---

ajax上传数据,(简洁版)

1.上传普通同表单标签内容。

    1.获取表单的内容

          1.

var file=$('#file').val();(放在点击事件后面)

        2.

var file = document.getElementById().value

    2.序列化数据

      

var dd ={"file":file};(也就是搞成键值对的形式)

   3.用ajax上传数据

      1.

data:JSON.stringify(文件名),
把对象的类型转换为json字符串类型

    4.后台用RequestBody Map<>接收

2.上传文件,比如照片

    1.获取表单内容,方法同上

var file = document.getElementById("file").files[0];
    var formFile = new FormData();
    formFile.append("file", file); //加入文件对象
    var data = formFile;

注意id后是files[0];不知为何,总之加上这句话就可以了。以后要用到的时候再详细了解。

      还要实例化FormData这个对象。没有这个传过去的就不是文件格式了

 2.ajax传过去

$.ajax({
        url: "addfilel",
        data: data,
        type: "Post",
        dataType: "json",
        cache: false,//上传文件无需缓存
        processData: false,//用于对data参数进行序列化处理 这里必须false
        contentType: false, //必须
        error:function () {
          alert("请求失败")
        },
        success:function (data) {
            var ss=data.file;
            document.getElementById("di").innerHTML='<img src="../statics/'+ss+'" />';
        }

这次的不要变成json就可直接传送了。

3.后台对文件进行操作

@RequestMapping(value = "/addfilel", method = RequestMethod.POST)
    @ResponseBody
    public Map<String,String> sendString(@RequestBody MultipartFile file)throws Exception{  //user是与页面参数对应的JavaBean
        //map集合用来存放返回值
        String filename=file.getOriginalFilename();
        int intt = filename.lastIndexOf(".");
        String str = filename.substring(intt);
        String newname= UUID.randomUUID()+str;
        newname = newname.replace("-", "");
        String  path="D:/idea_workspace/orgajks/src/main/webapp/statics";
        String str2=  FilenameUtils.concat(path,newname);
        file.transferTo(new File(str2));
        Map<String,String> Map = new HashMap<String, String>();
        Map.put("file",newname);
        return Map;
    }

return Map是为了在页面上显示。

世间种种的诱惑,不惊不扰我清梦
原文地址:https://www.cnblogs.com/javalisong/p/9585465.html