Phonegap Cordova 不会触发 JQM pageinit

Question

我对这个话题做了很多研究，但我没有找到合适的答案。 我的问题是，当我将 Cordova/Phonegap 与 JQM 一起使用时，$(document).ready 会被触发，而不是推荐与 JQM 一起使用的$(document).on('pageinit')。

<script type="text/javascript" src="cordova-2.7.0.js"></script>
<script src="js/jquery-1.10.1.min.js" type="text/javascript"></script>
<script>    
    var deviceReadyDeferred = $.Deferred();
    var jqmReadyDeferred = $.Deferred();
    document.addEventListener("deviceReady", deviceReady, false);
    function deviceReady() {
        deviceReadyDeferred.resolve();
}
$(document).on("mobileinit", function () {
    jqmReadyDeferred.resolve();
});
$.when(deviceReadyDeferred, jqmReadyDeferred).then(doWhenBothFrameworksLoaded);
function doWhenBothFrameworksLoaded() {
    console.log('device ready');    
    $(document).on("pageinit",function(){   
        console.log("document pageinit fired");
    }
}
</script> 
<script src="js/jquery.mobile-1.3.1.min.js" type="text/javascript"></script>
<script src="js/buttonset.js" type="text/javascript"></script>

此页面托管在远程服务器上。在这种情况下，设备就绪会出现在控制台中，但不会触发文档 pageinit。如果我用$(document).ready(function(){ 替换$(document).on("pageinit",function(){，两个日志都会出现，但我不喜欢这个解决方案。

你能告诉我哪里错了吗？

先谢谢了。

Answer 1

try this sequence of code in script tag.

/* Initialization of PhoneGap and jQM */

var deviceReadyDeferred = $.Deferred();
var jqmReadyDeferred = $.Deferred();


//initialize PhoneGap
document.addEventListener("deviceReady", deviceReady, false);
function deviceReady() {

}

//initialize jQM
$(document).on("mobileinit", function () {
  //hack to fix android page transition flicking issue
  if (navigator.userAgent.indexOf("Android") != -1){
      $.extend(  $.mobile , {
          defaultPageTransition: 'none'
      });   
    } 

  setCustomThemeAndOptions();

  jqmReadyDeferred.resolve();
});


//When both PhoneGap and jQM are ready, initialize language setting
$.when(deviceReadyDeferred, jqmReadyDeferred).then(function(){  
  deviceDeferred = true;
});