Php 完成$.ajax请求时显示进度图像

我有以下代码：

data = new FormData($('#form')[0]);
$.ajax({
    type: 'POST',
    url: 'systems/createpostsystem.php',
    data: data,
    cache: false,
    contentType: false,
    processData: false
}).done(function(data) {
    alert(data);
    window.location = "myposts.php";
});

我使用了

$.ajaxStart（）

，但它没有实现我想要的功能

我还尝试了

success:function（）{my code}

并提出了两次请求

---

现在，我想在这个AJax完成时显示一个进度图像。

您只需在执行AJax请求之前编辑DOM，添加加载程序，然后在

complete

回调中删除它。我通常使用jQuery回调函数，而不是XHR对象回调

请注意：

• 只有当请求成功完成时才会调用

  success

  回调（以及

  done

  XHR回调）
• 即使请求失败，

  complete

  （以及

  始终

  XHR回调）也将始终调用

例如：

function addLoader() {
    var img = $('<img />', { 
      id: 'loader',
      src: '/path/to/your/loader.gif'
    });
    img.appendTo($('body'));
}
function removeLoader() {
    $('#loader').remove();
}

addLoader(); // here the we add our loader
data = new FormData($('#form')[0]);
$.ajax({
    type: 'POST',
    url: 'systems/createpostsystem.php',
    data: data,
    cache: false,
    contentType: false,
    processData: false,
    complete: function() {
        removeLoader(); // here we remove it
    },
    success: function(data) {
        alert(data);
        window.location = "myposts.php";
    }
});

var formData = new FormData($('#form')[0]);
var imageContainer = $('#selector');
imageContainer.attr('src', 'path/to/loading.gif');
$.ajax({
    type: 'POST',
    url: 'systems/createpostsystem.php',
    data: formData,
    success: function(data) {
        // Do something
    }
});

函数addLoader（）{
var img=$（'
在执行ajax功能之前添加加载图像（我假设是gif）。成功后，删除图像并替换为所需内容（成功图像、服务器返回的数据等）

例如：

function addLoader() {
    var img = $('<img />', { 
      id: 'loader',
      src: '/path/to/your/loader.gif'
    });
    img.appendTo($('body'));
}
function removeLoader() {
    $('#loader').remove();
}

addLoader(); // here the we add our loader
data = new FormData($('#form')[0]);
$.ajax({
    type: 'POST',
    url: 'systems/createpostsystem.php',
    data: data,
    cache: false,
    contentType: false,
    processData: false,
    complete: function() {
        removeLoader(); // here we remove it
    },
    success: function(data) {
        alert(data);
        window.location = "myposts.php";
    }
});

var formData = new FormData($('#form')[0]);
var imageContainer = $('#selector');
imageContainer.attr('src', 'path/to/loading.gif');
$.ajax({
    type: 'POST',
    url: 'systems/createpostsystem.php',
    data: formData,
    success: function(data) {
        // Do something
    }
});

您尝试了什么？。刚刚编辑了我的问题，可能重复了调用AJAX时显示“加载图像”并将其隐藏在“.done（）”上。这是一种简单的方法。