ajax自定义FormData进行文件上传

最新推荐文章于 2022-06-04 20:59:42 发布

*饼饼*

最新推荐文章于 2022-06-04 20:59:42 发布

阅读量436

点赞数

分类专栏：前端

本文链接：https://blog.csdn.net/Hedy17/article/details/79379118

版权

前端专栏收录该内容

15 篇文章 0 订阅

订阅专栏

html:

 <div class="row">
            <div class="col-md-6">
                <div class="form-group">
                    <label class="control-label">白名单</label>
                    <div class="controls">
                        <form:input type="hidden"  path="whitelist" class="form-control " />
                        <input type="file"  id="uploadWhiteList" name="uploadWhiteList" multiple="multiple" class="form-control "                                          οnchange="uploadFile(event,'uploadWhiteList')"/>
                    </div>
                </div>
            </div>
        </div>

注： <form:input/>:用的是spring标签

js:

 function uploadFile(event,fileName){
        var targ=event.target;
        var form = new FormData();
        form.append(fileName, targ.files[0]);
        debugger;
        $.ajax({
            url:'/admin/upload/'+fileName,
            data:form,
            method:'post',
            processData:false,
            contentType:false,
            success:function (data) {
                var json=JSON.parse(data);
                if(json.code==0){
                    var filePath = json.url;
                    $(targ).prev().val(filePath);
                    alert(json.msg)
                }else{
                    alert(json.msg)
                }
            },
            error:function () {
                alert("请求数据失败");
            }
        })
    }