Javascript Phonegap-创建CSS加载屏幕

我正在使用Phonegap/Cordova，目前正在安卓系统中工作

我有几个页面可以创建许多DOM对象，加载页面需要时间。我正在尝试创建一个“加载…”屏幕，以便用户在一段时间内不会看到黑屏

我想CSS可能是最好的，但我根本无法让它显示出来

这是我试图使用的脚本

http://stackoverflow.com/questions/1964839/jquery-please-wait-loading-animation

所以我有我的gif动画，我把这段代码放在html页面的底部

<div class="modal"><!-- Place at bottom of page --></div>

然后，我将此代码放在application.js文件的开头

$("body").on({
ajaxStart: function() { 
    $(this).addClass("loading"); 
},
ajaxStop: function() { 
    $(this).removeClass("loading"); 
}    
});

当我测试代码时，我没有得到css层或gif动画，只是填充DOM对象时通常的黑屏

这种类型的加载屏幕在Phonegap中可用吗

任何帮助都将不胜感激

谢谢

---

*我还注意到，当我从这个示例链接转到JSFIDLE测试页面时，JQuery库被设置为1.7.2，我使用的是最新的2.0.3。当我在JSFIDLE中更改库时，示例就不再有效了。我假设代码的某些部分被折旧了

问题在另一个论坛上由用户jcesarmobile为我解决

"

来自jquery站点

AJAX事件应该附加到文档中

从jQuery 1.9开始，全局AJAX事件（ajaxStart、ajaxStop、ajaxSend、ajaxComplete、ajaxError和ajaxSuccess）仅在文档元素上触发。更改程序以侦听文档上的AJAX事件。例如，如果代码当前看起来像这样：

$（“#status”）.ajaxStart（function（）{$（this）.text（“ajaxstarted”）；}）； 将其更改为：

$（document）.ajaxStart（function（）{$（“#status”）.text（“ajaxstarted”）；}）

"

$("body").on({
ajaxStart: function() { 
    $(this).addClass("loading"); 
},
ajaxStop: function() { 
    $(this).removeClass("loading"); 
}    
});