如何在几秒钟后显示数据？

I know that i shouldn't do that but i want to make the spinner longer for the user. because for the moment the Ajax request is too quick so the user is not even able to see the spinner.

我知道我不应该这样做,但我想为用户做更长的旋转器。因为目前Ajax请求太快,所以用户甚至无法看到微调器。

Is there anyway to put at least 5 secondes for instance, so after these 5 second the data is displayed.

无论如何还有至少5个secondes,所以在这5秒之后显示数据。

$.ajax({
  type: "POST",
  url: $('#AjaxMoreStatus').attr("data-url"),
  dataType: "HTML",
  beforeSend: function() {
    $('.spinner').show();
  },
  complete: function() {
    $('.spinner').hide();
  },
  success: function (data) {
    $('#AjaxMoreStatus').append(data);
  }
});

1 个解决方案

#1

Just use setTimeout to fake delays:

只需使用setTimeout伪造延迟:

$.ajax({
  type: "POST",
  url: $('#AjaxMoreStatus').attr("data-url"),
  dataType: "HTML",
  beforeSend: function() {
    $('.spinner').show();
  },
  complete: function() {
    setTimeout(function () {
      $('.spinner').hide();
    }, 5000); // 5 seconds.
  },
  success: function (data) {
    $('#AjaxMoreStatus').append(data);
  }
});

If you want to delay the loading too, use it on the success function too:

如果你想延迟加载,也可以在成功函数上使用它:

$.ajax({
  type: "POST",
  url: $('#AjaxMoreStatus').attr("data-url"),
  dataType: "HTML",
  beforeSend: function() {
    $('.spinner').show();
  },
  complete: function() {
    setTimeout(function () {
      $('.spinner').hide();
    }, 5000); // 5 seconds.
  },
  success: function (data) {
    setTimeout(function () {
      $('#AjaxMoreStatus').append(data);
    }, 5000); // 5 seconds.
  }
});

#1