2015-09-25 85 views
1

我正在使用一個非常簡單的應用程序,它使用Jquery Mobile和Cordova.js,我使用phonegap模擬器在我的iPhone上運行de應用程序,將它連接到phonegap v0.1.9。在索引文件我有以下代碼:Cordova和Jquery Mobile

<!DOCTYPE html> 
<html> 
    <head> 
     <meta charset="utf-8" /> 
     <meta name="format-detection" content="telephone=yes" /> 
     <meta name="msapplication-tap-highlight" content="no" /> 
     <!-- WARNING: for iOS 7, remove the width=device-width and height=device-height attributes. See https://issues.apache.org/jira/browse/CB-4323 --> 
     <meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height, target-densitydpi=device-dpi" /> 
     <script type="text/javascript" src="js/jquery-2.1.4.min.js"></script> 
     <script type="text/javascript" src="js/cordova.js"></script> 
     <script src="http://servicios.usig.buenosaires.gov.ar/usig-js/2.4/usig.MapaInteractivo.min.js" type="text/javascript"></script> 
     <script type="text/javascript" src="js/index.js"></script> 
     <link rel="stylesheet" type="text/css" href="css/jquery.mobile-1.4.5.min.css" /> 
     <link rel="stylesheet" type="text/css" href="css/index.css" /> 
     <script> 

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

      $(document).on("mobileinit", function() { 
       alert("mobile init"); 
       jqmReadyDeferred.resolve(); 
      }); 
      function init() { 

       document.addEventListener("deviceReady", deviceReady, false); 
       function deviceReady() { 
        alert("device Ready"); 
        deviceReadyDeferred.resolve(); 
       } 

       $.when(deviceReadyDeferred,jqmReadyDeferred).then(onDeviceReady); 
      } 
      function onDeviceReady() { 
       // Now safe to use the Cordova API 
       alert("End of init"); 
       app.initialize(); 
      } 

     </script> 

     <script type="text/javascript" src="js/jquery.mobile-1.4.5.min.js"></script> 
     <title>My app</title> 
    </head> 
<body onload="init()"> 
    <div data-role="page"> 
</body> 
</html> 

我真的不知道,如果我打電話的.js文件的方式是正確的,但它是我得到它的工作或多或少的方式。 使用Chrome插件我可以模擬我的手機,並且所有功能都按預期的順序工作。但是,當我在手機上運行應用程序uning phonegap模擬器來運行應用程序時,它會加載Jquery,並且必須將其最小化,然後恢復de應用程序以使設備調用被觸發。 我是否以錯誤的方式調用函數?或者它是一個手機模擬器問題? 感謝您的幫助!

回答

0

我要輸入我得到這個工作的方式:

電話的jquery.js和Cordova.js:

<script type="text/javascript" src="js/jquery-2.1.4.min.js"></script> 

    <script type="text/javascript" src="cordova.js"></script> 

我有我自己的index.js與功能的文件I希望已分別實施:

<script type="text/javascript" src="js/index.js"></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() { 
      app.receivedEvent('deviceready'); 
      Call my own functions from index.js file 
     } 

    </script> 
    <script type="text/javascript" src="js/jquery.mobile-1.4.5.js"></script> 
    <title>Tittle</title> 
</head> 
<body>... </body> 

我希望這可以幫助別人通過我有同樣的問題去。乾杯!