添加 JQTouch 加载图像 onClick

【问题标题】：Adding JQTouch Loading Image onClick添加 JQTouch 加载图像 onClick
【发布时间】：2012-12-07 19:04:00
【问题描述】：

我想知道是否有一种方法可以将 loading.gif 图像添加到通过链接链接的所有页面。 .我已经在 StackOverFlow 上阅读了几个小时，但没有发现任何有用的东西。我想用它来显示加载图像并禁用按钮，直到页面加载完毕，然后显示页面。

所以在文档打开时显示加载图像，然后在文档加载后删除加载图像。

我会粘贴一些代码，但我尝试过的所有代码都不起作用。有人可以引导我朝着正确的方向前进，或者如果有一个简单的代码 sn-p，我将不胜感激。

【问题讨论】：

标签： javascript jquery ajax jqtouch

【解决方案1】：

这适用于使用 Zepto 的 jQTouch（尚未使用 jQuery 测试）。

HTML：

<div id="jqt">
    ...
    <div id="loading"></div>
</div>

CSS：

div#jqt #loading {
  background: rgba(0,0,0,0.5) url('../images/scanner/loading.gif') 50% 50% no-repeat;
  z-index: 999;
  position: fixed;
}

JS：

$(document).on('ajaxStart', function(){
    $('#loading').addClass('current');
});

$(document).on('ajaxStop', function(){
    $('#loading').removeClass('current');
});

【讨论】：