• formData+ajax文件上传


    html代码:

    <form class="form-horizontal" enctype="multipart/form-data" method="post" id="abcdefg">
        <input id="js-input-file1" name="file1" class="js-fileupload" type="file">
        <input id="js-input-file2" name="file2" class="js-fileupload" type="file">
    </form>

    js代码:

    //楼主觉得原生input文件选择框较丑,使用的样式为jquery fileupload插件;选择文件后将文件名显示左侧
    //<input id="js-input-file1" name="text1" >
    //<input id="js-input-file1" name="file1" type="file">
    
    //$('#js-input-file1').fileupload({
    //    replaceFileInput: false, //此处尤为重要,否则无法配合formData使用
    //    dd: function(e, data) {
    //        var filename = data.files[0].name;
    //        $('input[name="text1"]').val(filename);
    //    },
    //});
    
    //通过jquery获得form表单对象
    var form = $("#abcdefg")[0];
    var formData = new FormData(form);
    //formData可以添加额外参数
    formData.append("extra", "123456");
    $.ajax({
        url: url,
        type: 'POST',
        data: formData,
        contentType: false, //禁止设置请求类型
        processData: false, //禁止jquery对DAta数据的处理,默认会处理
        success: function(data) {
        },
        error: function (data) {
        }
    });
    

     java代码:

    @RequestMapping(value = "/xxx", method = RequestMethod.POST)
        public ResponseEntity createLoadBalancer(@RequestParam("file1") MultipartFile file1,
                                                 @RequestParam("file2") MultipartFile file2,
                                                 String extra){
        }
    

      

  • 相关阅读:
    【扫盲】i++和++i的区别
    java 字符串String.intern()方法学习
    随机访问和快速访问
    Semaphore信号量深度解析
    CyclicBarrier回环屏障深度解析
    CountDownLatch深度剖析
    静态代理和装饰者模式的区别
    AspectJ之@DeclareParents注解为对象添加新方法
    C#开发上位机常用
    使用Charles进行抓包、篡改请求、设置代理
  • 原文地址:https://www.cnblogs.com/HushAsy/p/10342615.html
Copyright © 2020-2023  润新知