2012-11-02 36 views
10

我正在構建PhoneGap應用程序。不幸的是,當部署到iOS設備和模擬器時,事件永遠不會觸發。我使用Phonegap 2.2.0。Phonegap設備無法在iOS中使用Cordova 2.2.0

當我將相同的代碼部署到Android(當然使用Android特定的cordova.js文件),該應用程序將完美工作。

當我用jQuery- ready()替換deviceready時,該應用程序也將在iOS上加載,但它將無法訪問設備特定的API。

加載了cordova.js,因爲我會看到一條簡單的警報消息,我將其放入其中,但deviceready永遠不會觸發,並且API永遠不會暴露。

我HTMLS head

<script type="text/javascript" charset="utf-8" src="js/cordova.js"></script> <!-- yes it is the iOS version --> 
<script src="js/jquery-1.8.2.min.js"></script> 
<script src="js/app.js"></script> 

我的JS:

function doStuff(){ 
//app functionality 
} 
document.addEventListener('deviceready', doStuff, false); 

但不知何故東西只會被Android上做...

回答

10
在我的HTML

我有一個onload事件觸發向設備添加事件監聽器

 function onDeviceReady() { 
     console.log("we are an app"); 
     MyApp.initialize_phonegap(); 
     } 

     function onBodyLoad() { 
     document.addEventListener("deviceready", onDeviceReady, false); 
     } 

    </script> 

    </head> 

    <body onload="onBodyLoad()"> 
+0

這似乎是問題的原因,謝謝。但說實話,我仍然有點困惑,因爲我不明白爲什麼我需要在另一個事件處理程序中嵌套事件處理程序。 'addEventListener'方法應該從開頭和'document'都可用,不是嗎?你有這種行爲的解釋嗎? – m90

+0

你有一個身體onload =?第一次讓我絆倒了。我同意你的看法,如果雙事件處理程序設置是解決方案,那將會很奇怪。 – olore

+0

不,我沒有第一個,因爲我沒有得到「邏輯」,當它「以某種方式」工作,但我繼續使用默認項目設置使用的方法,看到我的答案下面。 – m90

4

要添加到olore的答案我結束了使用默認項目中的代碼(從./create腳本構建)使用(這是不同於Event docs中的代碼)的方法。

的主要區別是(我真的不知道這些哪一個實際上將被考慮在內):

  • cordova-2.2.0.js位於根文件夾
  • <script> s的前右包含關閉</body> -tag,而不是在文檔的head
  • deviceready - 處理工作,如:

    var app = { 
    // Application Constructor 
    initialize: function() { 
        this.bindEvents(); 
    }, 
    // Bind Event Listeners 
    // 
    // Bind any events that are required on startup. Common events are: 
    // 'load', 'deviceready', 'offline', and 'online'. 
    bindEvents: function() { 
        document.addEventListener('deviceready', this.onDeviceReady, false); 
    }, 
    // deviceready Event Handler 
    // 
    // The scope of 'this' is the event. In order to call the 'receivedEvent' 
    // function, we must explicity call 'app.receivedEvent(...);' 
    onDeviceReady: function() { 
        app.receivedEvent('deviceready'); 
        myApp.start(); //this is where I put the call to my App's functionality relying on device APIs 
    }, 
    // Update DOM on a Received Event 
    receivedEvent: function(id) { // I didn't really use this, yet I left it in here as it's in the demo 
        var parentElement = document.getElementById(id); 
        var listeningElement = parentElement.querySelector('.listening'); 
        var receivedElement = parentElement.querySelector('.received'); 
    
        listeningElement.setAttribute('style', 'display:none;'); 
        receivedElement.setAttribute('style', 'display:block;'); 
    
        console.log('Received Event: ' + id); 
    } 
    }; 
    
  • 最後<script>標籤只是調用app.initialize()

這似乎是工作在iOS和Android相當精細,是一個小比雙處理器從文檔築巢更容易理解我。

+1

我認爲它是這樣的外部文件,模擬器或全部: -phonegap開始 -loads整個應用程序 -fires設備就緒事件 - 啓動運行JS -assign事件 - 但它已經被解僱。 基本上先載入然後運行後來弄亂了邏輯。 –

0

我發現如果不小心將cordova.js腳本包含兩次,那麼deviceready事件不會觸發。

1

這似乎讓如果你後加入deviceready聽衆以前cordova.js一個區別:

我無法找到任何這文件,但科爾多瓦。js攔截對addEventListener + removeEventListener的調用,並只調用已在 cordova.js之前添加的deviceready回調。

解決方案在我的情況只是重新安排腳本命令:

<script> 
document.addEventListener('deviceready', ...) 
</script> 
<script src="cordova.js"></script> 
0

我有同樣的問題。我通過添加設備插件來實現它。

$ cordova plugin add org.apache.cordova.device 

驗證:

$ cordova plugin ls 
相關問題