在运行任何ajax查询时，向用户显示小状态指示器的好方法是什么？

Question

使用phonegap + jquery mobile时，显示小状态指示器的最佳方法是什么 在任何后台ajax查询运行时给用户？

• 它不需要指示进度，只需显示是否发生了某些事情。
• 它需要处理多个查询同时处于活动状态的情况 如果其中一个查询失败而另一个查询失败，则不要留下挂起指示符。

Answer 1

我倾向于有一个带有ID msg的div，它位于内容部分的顶部，当我调用ajax调用加载时，这个加载只是$（'＃msg'）。show（'slow “）;然后当一切都完成后我隐藏，尝试过pageLoading但是所有都依赖于框架加上我发现这似乎并不总是有用，加上你不能动态地改变文本，有了ID你可以改变html内容来说搜索....或者正在上传....但仍然可以获得相同的效果。

如果你正在做jquery mobile我会建议你将div data-type = header'更改为与页脚和内容相同的标题标签 并且做你自己的CSS，jquery在这方面非常糟糕并且执行非常糟糕。

标题

header { position:fixed; left:0; right:0; top:0; height:50px; overflow:hidden; }
<header class='ui-bar-a"></header>

只是因为你想要提高性能，你会惊讶于当你不这样做时会更容易和更快 让jquery运行代码只是因为你有一个标题栏!!!

但希望这些建议有助于加载通知，因为手机应用程序基本上是网站更容易 如果你仍然认为网络，而不是试图制作一个应用程序。

哦，如果您使用直播（'点击'更改此内容以获取巨大差异： - ）

Answer 2

这是我能够提出的最佳解决方案：

function begin() {
    $(document).ajaxStart(function() {
        $.mobile.pageLoading();
    });
    $(document).ajaxStop(function() {
        $.mobile.pageLoading(true);
    });  
}
document.addEventListener("deviceready", begin, true);

这具有易于实现且不需要诸如图像等任何额外资源的优点 但另一方面，该指标有点巨大而且具有侵入性。如果可以的话，角落里的小指示器可能会更好 很容易实现。