I'm Trying to upload image on with jquery and ajax. But weird thing happened here. In console Log its showing

TypeError:对未实现的对象调用了"append"

请告诉我我做错了什么?

JS script

var prosrc=$("#pro_pix img").last().attr("src");
$("#logoform").on('change',function(event){
var postData = new FormData(this);
$("#pro_pix img").last().hide();
$("#pro_pix img").first().show();
event.preventDefault();
$.ajax(
    {
        url : "/function/pro_pic_upload.php",
        type: "POST",
        data : postData,
        success:function(data, textStatus, jqXHR)
        {
        $("#pro_pix img").last().show();
        $("#pro_pix img").first().hide();
        $("#pro_pix h6").text(data);
        },
        error: function(jqXHR, textStatus, errorThrown)
        {
            //if fails     
        }
    });
});

My HTML Markup

 <div class="row">
    <!-- left column -->
    <div id="pro_pix" class="col-md-4 col-sm-6 col-xs-12">
      <div class="text-center">
        <img src="template/image/725.GIF" class="avatar img-circle img-thumbnail" style="display:none" alt="avatar">
        <img src="<?php echo $rowuser['profile_logo']; ?>" class="avatar img-circle img-thumbnail" alt="avatar">
        <h6>Upload a different photo...</h6>
        <form role="form" id="logoform" enctype="multipart/form-data">
        <input id="logo" name="logo" type="file" class="text-center center-block well well-sm">
        </form>
      </div>
    </div>

推荐答案

in order to use formdata with jquery you have to set the correct options

$.ajax({
    url : "/function/pro_pic_upload.php",
    type: "POST",
    data : postData,
    processData: false,
    contentType: false,
    success:function(data, textStatus, jqXHR){
        $("#pro_pix img").last().show();
        $("#pro_pix img").first().hide();
        $("#pro_pix h6").text(data);
    },
    error: function(jqXHR, textStatus, errorThrown){
        //if fails     
    }
});

.ajax reference

processData (default: true)

类型:布尔型

By default, data passed in to the data option as an object (technically, anything other than a string) will be processed and transformed into a query string, fitting to the default content-type "application/x-www-form-urlencoded". If you want to send a DOMDocument, or other non-processed data, set this option to false.

Jquery相关问答推荐

如何在html css中制作响应表

将选定2个AJAX结果显示到模板中

更改高亮 colored颜色

为什么我的 toFixed() 函数不起作用?

如何获取将在不提交的情况下提交的所有表单值

[本机代码]是什么意思?

如何在 jQuery 中获取浏览器滚动位置?

JavaScript 吸管(告诉鼠标光标下像素的 colored颜色 )

从 iframe 访问父窗口的元素

使用 JQuery 更改 :before css Select 器的宽度属性

jQuery - 使用发布数据重定向

如何将参数传递给 JavaScript 中的匿名函数?

点击时保持 Bootstrap 下拉菜单打开

触发下拉更改事件

延迟jquery悬停事件?

jQuery表格行中的每个循环

订单对象是否由指定的 jQuery Select 器返回?

数据表日期排序dd/mm/yyyy问题

如何使用 JQuery $.scrollTo() 函数滚动窗口

jQuery:通过 .attr() 添加两个属性;方法