javascript - ajax请求在pace.js中时不显示动画

Question

在我的网站http://www.eventiame.com/publicar/中有一个包含多个字段的表单。当页面加载时，它会显示速度动画（加载时它会执行一些 ajax 请求，所以没关系）但是当我提交表单时（我也通过 ajax 进行），动画不会出现。我测试了上传图像（因此需要更长的时间），但仍然没有显示动画。我还尝试在 akax 请求中将“async”参数更改为 true 或 false，但仍然没有好处。

这是不起作用的ajax调用的特定代码：

$.post('Sample.php,$(this).serialize(),function(data){
    $(target).html(data);
},'html');

Answer 1

你可以试试这个：

$(document).ajaxStart(function() { 
       Pace.restart(); 
});

我遇到了同样的问题，我在 Pace 问题部分找到了解决方案。资源

Answer 2

我希望我的回答还不算太晚，但如果那些可能仍然需要它的人，我也遇到了同样的问题，我解决了。

默认情况下，Pace 将显示作为正常或 ajax-y 页面加载的一部分开始的任何 ajax 请求，或者持续时间超过 500 毫秒。您的 ajax 请求没有触发步伐，因为它为时过早。

1、修改Pace.js：

restartOnRequestAfter在 下查找defaultOptions并将其更改为所需时间（以毫秒为单位）值5ms。

  restartOnRequestAfter: 5,

2、跟踪：

默认情况下，Pace 只会跟踪GETHTTP 方法，因此请添加您可能需要的所有其他方法，例如POST请求。

ajax: {
  trackMethods: ['GET', 'POST', 'PUT', 'DELETE', 'REMOVE'],
  ...
}

资料来源：http: //github.hubspot.com/pace/

Answer 3

您缺少单引号，应该是：

$.post('Sample.php', $(this).serialize(), function(data){
    $(target).html(data);
}, 'html');