时间戳

首页 > 解决方案 > 如何给ajax加载器超时？

jquery - 如何给ajax加载器超时？

问题描述

我在为加载程序添加计时器时遇到问题，
我希望加载程序花费更长的时间来调用该函数。

我已经$.ajaxSetup加载了这样的装载机

a.ajaxSetup({
headers: {"X-CSRF-TOKEN": a('meta[name="csrf-token"]').attr("content")},

beforeSend: function(){
    a('.page-overlay').addClass("loading");
},
complete: function() {
  a('.page-overlay').removeClass("loading");
},
});

然后我这样称呼$.ajaxSetup：

a(document).on('click', 'a#details_transactions', function(e){
var d = a(this).data('pid'),
    s = a('#CallModal'),
    w = a('.modal-content');
  e.preventDefault(),
    a.post(transaction_details,{_token: csrf_token, pid: d}).done((e) => {
      s.modal('show');console.log(e);w.html(e)
    }).fail((e)=>{s.modal('hide');Toast.fire({icon: 'error',title: 'Something Wrong. Please try again!'})});
 });

如果是这样，如何添加计时器以使加载程序看起来需要很长时间才能加载？

已编辑

我尝试setTimeout在两者之间使用

s.modal('show');console.log(e);w.html(e)

然后

 setTimeout(function() {
 s.modal('show');console.log(e);w.html(e)
 },2000)

但在timeOut.
我认为有问题，.done因为这个调用后.done函数。

那么，我应该使用$.ajaxwith success:for give atimer吗？

标签： jqueryajax

解决方案

所以你有$.ajaxSetup()它适用于你可能有的所有ajax请求......

但是对于以下特定请求，您希望加载程序被延迟。

我认为您的解决方案将是使用其中的global参数$.post()以避免$.ajaxSetup()触发该参数。

是否为此请求触发全局 Ajax 事件处理程序。参考。

因此，您可以.loading在这里以不同的方式进行管理，而不会影响其余部分。

a(document).on('click', 'a#details_transactions', function(e){
  e.preventDefault();
  
  var d = a(this).data('pid'),
      s = a('#CallModal'),
      w = a('.modal-content');
    
  a('.page-overlay').addClass("loading");  // add the loading class here
  
  // Notice the global: false here!
  a.post({
    url: transaction_details,
    data: {_token: csrf_token, pid: d},
    global: false
  }).done((e) => {
  
    // Use the setTimeout here
    setTimeout(function(){
      s.modal('show');console.log(e);w.html(e);
      a('.page-overlay').removeClass("loading");  // remove the loading class here
    },2000);

  }).fail((e)=>{
    s.modal('hide');
    a('.page-overlay').removeClass("loading");  // remove the loading class here too!
    Toast.fire({icon: 'error',title: 'Something Wrong. Please try again!'})
  });
});

推荐阅读