使用 AJAX 加载器的最佳方法？答案

【问题标题】：Best approach for using AJAX loaders?使用 AJAX 加载器的最佳方法？
【发布时间】：2008-10-11 04:17:20
【问题描述】：

在动态更新内容 DIV 之前，我已经实现了一些用于启动 AJAX 加载器的糟糕解决方案，但似乎没有一个是“通用的”，而且我发现每次这样做时我都在修改它。如果我有一个 DIV，其内容会根据用户在页面上单击的内容进行更新，并且我想在此内容 DIV 上显示加载器，那么最好的方法是什么？我见过一些开发人员总是在页面上使用加载器，他们只是将其显示为块或不显示，我还看到其他人将其附加到 DIV。当您还有多个可以更新的区域时怎么办？我在想一些可重复的东西，我可以用函数调用，也许传递一些参数。

【问题讨论】：

标签： ajax loader

【解决方案1】：

一些 JavaScript 库允许监听打开和关闭请求。查看 Prototype 的 request Responder http://www.prototypejs.org/api/ajax/responders。

你会这样做：

Ajax.Responders.register({
  onCreate: function() {
    $('loader').show();
    Ajax.activeRequestCount++;
  },
  onComplete: function() {
    Ajax.activeRequestCount--;
    if (Ajax.activeRequestCount < 1) $('loader').hide();
  }
});

至于加载的可视化表示，您可能希望识别页面的不同部分，这些部分可能需要单独的加载图形和请求对象的子类，每次都指示请求的类型。

例如
它是一个被保存的字段吗？ new FieldUpdateRequest(field)
是正在加载的页面吗？ new Request();
容器是否正在更新？ new PartialRequest(div);

然后捕获每个子类类型并显示或隐藏不同的加载器图形。

不幸的是，没有快速的解决方案，哈尔。您可以构建一个通用脚本来将加载器图形附加到容器中，这样可以节省一些重复。如果你这样做了，介意把它贴在这里:)？

【讨论】：

这是一个很好的答案。感谢您提供所有详细信息。

【解决方案2】：

您可以使用 JQuery progress bar 或其他库中的类似名称。

【讨论】：