Ajax之文件上传处理

最新推荐文章于 2023-10-07 10:38:06 发布

Quincy379

最新推荐文章于 2023-10-07 10:38:06 发布

阅读量1k

点赞数

分类专栏： ajax HTML 文章标签： ajax

本文链接：https://blog.csdn.net/qq_33733970/article/details/78536901

版权

HTML 同时被 2 个专栏收录

70 篇文章 1 订阅

订阅专栏

ajax

5 篇文章 0 订阅

订阅专栏

前台处理

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="/static/jquery3.2.1.js"></script>
    <script src="/static/dist/sweetalert2.all.min.js"></script>
    <link rel="stylesheet" href="/static/dist/sweetalert2.min.css">
    <script src="https://cdn.bootcss.com/jquery-cookie/1.4.1/jquery.cookie.min.js"></script>

    <script>
        $(function () {
            var formData = new FormData();
            formData.append('file', $('#file')[0].files[0]);
            $('#sbt').click(function () {
                $.get({
                    url: '/get_result/',
                    data: formData,
                    done: function (data) {
                        alert('hello,jj')
                    },
                    fail: function () {
                        alert('失败')
                    }
                })
            })
        })

    </script>
</head>
<body>
<form action="/get_result/" method="post" enctype="multipart/form-data">
    {% csrf_token %}
    <p>文件<input type="file" name="file" id="file"></p>
    <input type="submit" value="提交" id="sbt">
</form>

</body>
</html>

后台处理

def get_result(request):

    with open(request.FILES.get('file').name, 'wb') as f:
        for item in request.FILES.get('file'):
            f.write(item)
    return HttpResponse('OK')

关键点在于：

前台通过$('#file')[0].files[0]获取上传的文件对象，后台通过request.Files.get('file')获取文件对象。

Quincy379

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
复制链接

分享到 QQ

分享到新浪微博

扫一扫

专栏目录