Javascript 如何在表单更新后重新加载html中的特定区域

我有一个表单需要使用Ajax更新profle图片。。。。一旦上传，需要在不刷新页面的情况下更改区域

这是我的html

            <div class="row">
                <div class="col-md-12">
                    <form data-action="{% url 'user-profileupdate' %}"  id="profile-file-upload" method="post" enctype="multipart/form-data">
                        <div class="text-center">
                            <div class="avatar-upload">
                                <div class="avatar-edit">
                                     <input name="input_file" type="file" id="profile-pic-upload" />
                                    <label for="profile-pic-upload"></label>
                                </div>
                                <div class="avatar-preview">
                                    {% if user_profile.avatar %}
                                        <div id="imagePreview" style="background-image: url('{{user_profile.profile_pic}}');"></div>
                                    {% else %}
                                        <div id="imagePreview" style="background-image: url('{% static 'assets/img/user-64x.png' %}');"></div>
                                    {% endif %}
                                </div>
                            </div>
                        </div>
                    </form>
                </div>
            </div>

当前正在successfunction中更新toster

---

我需要通过ajax成功更新图像

ajax响应是什么？在您的问题中添加您的视图。从视图中得到的响应是{状态：true，msg:“配置文件图片已成功更新。”，Profile_pic:“s3 bucket url”}尝试

document.getElementById（“imagePreview”）.style.backgroundImage='url（'+data['Profile_pic']+）document.getElementById（“imagePreview”）.style.backgroundImage='url（'+data['profile_pic']+'）；这将导致什么是ajax响应？在您的问题中添加您的视图。从视图中得到的响应是{状态：true，msg:“配置文件图片已成功更新。”，Profile_pic:“s3 bucket url”}尝试
document.getElementById（“imagePreview”）.style.backgroundImage='url（'+data['Profile_pic']+）document.getElementById（“imagePreview”）.style.backgroundImage='url（'+data['profile_pic']+'）；这是行不通的
$("#profile-pic-upload").change(function () {
    var data = new FormData();
    var file = this.files[0];
    data.append("file", file);
    $.ajax({
        type: 'POST',
        data: data,
        contentType: false,
        processData: false,
        url: $("#profile-file-upload").data('action'),
        cache: false,
        success: function (data, status) {
            $("#imagePreview").load(" #imagePreview")
            if (data['status'] == true) {
                toastr.success(data.msg);
                $('#profile-pic-upload').val('');
            }
            else {
                toastr.error(data.msg);
            }
        }
    });
});