ajax - 在 jQuery Mobile 1.3 中的 Ajax 调用上显示页面加载器（微调器）

Question

我有一个 jQuery Mobile 1.3.0 应用程序，它通过 Ajax 调用来动态加载数据。我在以前版本的 jQuery Mobile 中看到了执行此操作的各种选项（请参阅Show Page Loading Spinner on Ajax Call in jQuery Mobile），但尚未找到 1.3 的答案。

Ajax 调用类似于：

$.getJSON(url, function(data) {
  console.log(JSON.stringify(data));
  $.each(data.cards, function(index, card) {
    $('#card-name').text(card.title);
  });
});

为每个 Ajax 调用显示加载微调器的最佳方法是什么？

Answer 1

经过一些研究并尝试了几个选项，我发现这对于应用程序中的每个 Ajax 调用都很有效。我在 JavaScript 顶部添加了以下代码：

// Load the spinner if an ajaxStart occurs; stop when it is finished
$(document).on({
  ajaxStart: function() { 
    $.mobile.loading('show');
  },
  ajaxStop: function() {
    $.mobile.loading('hide');
  }    
});

这样，无论我通过 Ajax 加载数据的地方有多少，通过添加这段代码一次，就会显示 jQuery Mobile 加载器（微调器）。

如果有人知道更好的方法，请告诉我。