Phonegap 设备无法在 iOS 中使用 Cordova 2.2.0 触发答案

【问题标题】：Phonegap deviceready not firing using Cordova 2.2.0 in iOSPhonegap 设备无法在 iOS 中使用 Cordova 2.2.0 触发
【发布时间】：2012-10-23 03:57:51
【问题描述】：

我正在构建一个 PhoneGap 应用程序。不幸的是，当部署到 iOS 设备和模拟器时，deviceready 事件永远不会触发。我正在使用 Phonegap 2.2.0。

当我将相同的代码部署到 Android 时（当然使用 Android 特定的 cordova.js 文件），应用程序将完美运行。

当我将 deviceready 替换为 jQuery-ready() 时，该应用程序也会在 iOS 上加载，但它将无法访问特定于设备的 API。

cordova.js 已加载，因为我将看到我放入其中的简单警报消息，但 deviceready 永远不会触发并且 API 永远不会暴露。

我的 HTML 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 上完成......

【问题讨论】：

标签： javascript jquery ios cordova

【解决方案1】：

在我的 html 中，我有一个 onload 触发将事件侦听器添加到 deviceready

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

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

    </script>

  </head>

  <body onload="onBodyLoad()">

【讨论】：

这似乎是问题的原因，谢谢。但老实说，我仍然有点困惑，因为我不太明白为什么我需要在另一个事件处理程序中嵌套一个事件处理程序。 addEventListener 方法和 document 应该从一开始就可用，不是吗？你对这种行为有什么解释吗？
你有body onload= 吗？这让我第一次绊倒。我同意你的看法，如果双事件处理程序设置是解决方案，那就太奇怪了。
不，我一开始就没有，因为我没有得到“逻辑”，当使用它“以某种方式”工作时，但我继续使用默认的方法项目设置使用，请参阅下面的答案。

【解决方案2】：

为了补充 olore 的答案，我最终使用了默认项目中的代码（从 ./create 脚本构建）使用的方法（这与 Event docs 中的代码不同）强>)。

主要区别是（我真的不知道实际上要考虑其中哪一个）：

cordova-2.2.0.js 位于根文件夹中
<script>s 包含在结束 </body>-tag 之前，而不是文档的 head

deviceready-handling 的工作方式如下：

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 上运行良好，并且比文档中嵌套的双重处理程序对我来说更容易理解。

【讨论】：

我认为对于外部文件、模拟器或所有文件来说都是这样的：-phonegap 启动 - 加载整个应用程序 - 触发设备就绪事件 - 开始运行 js - 分配事件 - 但它已经被触发了。基本上是先加载然后再运行，这弄乱了逻辑。

【解决方案3】：

如果您在 cordova.jsbefore 或 after 添加 deviceready 侦听器似乎会有所不同>：

我无法找到任何相关文档，但 cordova.js 拦截了对 addEventListener + removeEventListener 的调用，并且只调用了 before cordova.js 添加的 deviceready 回调。

在我的情况下，解决方案只是重新排列脚本顺序：

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

【讨论】：

【解决方案4】：

我发现如果你不小心包含了两次 cordova.js 脚本，那么 deviceready 事件不会触发。

【讨论】：

【解决方案5】：

我遇到了同样的问题。我通过添加设备插件让它工作。

$ cordova plugin add org.apache.cordova.device

验证：

$ cordova plugin ls

【讨论】：