在jQuery Mobile 1.3中使用Ajax调用显示页面加载器(Spinner)

Question

我有一个jQuery Mobile 1.3.0应用程序正在进行Ajax调用以动态加载数据.我已经在jQuery Mobile的早期版本中看到过这样做的各种选项(请参阅jQuery Mobile中的Ajax Call上的Show Page Loading Spinner),但是没有找到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加载程序(微调器).

如果有人知道更好的方法,请告诉我.