未调用 onDeviceReady 函数答案

【问题标题】：onDeviceReady function not called未调用 onDeviceReady 函数
【发布时间】：2013-05-30 20:16:55
【问题描述】：

我正在完成我的第一个 phonegap 教程，但我遇到了问题。

我已设置 onDeviceReady() 函数在“deviceready”事件触发时被调用，但该方法永远不会被调用。
我尝试直接调用 App.start() 方法，但在控制台中收到错误，提示 APP.start() 方法不存在。

感谢您的帮助！

Index.html 和 App.js 的代码如下：

Index.html

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <meta name="format-detection" content="telephone=no" />
    <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" charset="utf-8"
    src="cordova/cordova-2.2.0-android.js"></script>
    <script type="text/javascript" charset="utf-8"
    src="framework/utility.js"></script>
    <script type="text/javascript" charset="utf-8"
    src="app.js"></script>
    <link rel="stylesheet" href="framework/base.css" type="text/css" />
    <link rel="stylesheet" href="style/style.css" type="text/css" />
    <title>Chapter 1 App: Quiz Time</title>
</head>
<body>
    <div class="container" id="rootContainer">
    </div>
    <div id="preventClicks"></div>
</body>
</html>

app.js

document.addEventListener("load",function(){

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

    function onDeviceReady() {
        alert("WOAH!");
        start();
    }

    start = function() {
        PKUTIL.include([ "framework/ui-core.js", "framework/device.js" ],
                function() {
                    init();
                });
    }

    init = function() {
        PKUI.CORE.initializeApplication();
        PKUTIL.loadHTML("views/gameView.html", {
            id : "gameView",
            className : "container",
            attachTo : $ge("rootContainer"),
            aSync : true
        }, function(success) {
            if (success) {
                gameView.initializeView();
            }
        });

        PKUTIL.loadHTML("views/endView.html", {
            id : "endView",
            className : "container",
            attachTo : $ge("rootContainer"),
            aSync : true
        }, function(success) {
            if (success) {
                endView.initializeView();
            }
        });

        PKUTIL.loadHTML("views/startView.html", {
            id : "startView",
            className : "container",
            attachTo : $ge("rootContainer"),
            aSync : true
        }, function(success) {
            if (success) {
                startView.initializeView();
                PKUI.CORE.showView(startView);
            }
        });
    }

更新：

将 type="application/javascript" 更改为 `type="text/javascript"'
在负载监听器中添加设备就绪监听器。
还是没有运气！

【问题讨论】：

标签： android cordova

【解决方案1】：

将您的标签替换为：

<script type="text/javascript" ...

使用应用程序/javascript mime 类型不是标准方法。

检查您的代码是否存在语法错误（在 Safari 或 Chrome 等中运行，并打开控制台以查看它们）。我发现，当 PhoneGap 出现问题时，通常是因为某个地方出现了 JS 错误。

删除所有脚本，除了您要测试的东西（设置 deviceready 事件的行和它运行的函数），然后逐一介绍每个代码块和脚本，看看它什么时候停止。这样您就可以隔离导致问题的代码块。

【讨论】：

【解决方案2】：

我自己也遇到过类似的问题。我会尽力提供任何建议。

首先，如果您查看 Phonegaps Device Ready 文档，它会注意到 Typically, you will want to attach an event listener with document.addEventListener once the HTML document's DOM has loaded.。如果您查看源代码，其原因是它们实际上用自己的函数覆盖了document.addEventListener，该函数处理deviceready 的所有绑定。

我发现自己在动态加载 phonegap 时，如果我在它挂接之前为deviceready添加我的事件侦听器，它永远不会出现，但如果我等到脚本元素加载，它工作正常.通常，如果您只是直接使用<script> 标签，它们实际上是同步加载的，所以这不是问题。有可能在 body 元素中包含脚本可能会导致它们以非同步方式加载，所以我可能会尝试将它们移动到头部或 </html> 上方，并尝试更改为更标准的脚本元素，就像亨利建议的那样。

<script type="text/javascript" src="cordova/cordova-2.2.0-android.js"></script>
<script type="text/javascript" src="framework/utility.js"></script>
<script type="text/javascript" src="app.js"></script>

【讨论】：

我做了这些更改，但仍然没有运气：/

【解决方案3】：

你的js应该是这样的

document.addEventListener("deviceready",onDeviceReady,false);    

function onDeviceReady() {
    alert("WOAH!");
    start();
}

function start() {
    PKUTIL.include([ "framework/ui-core.js", "framework/device.js" ],
            function() {
                init();
            });
}

当你的 js 加载完毕，cordova 准备好了，你的 onDeviceReady 函数就会被执行。此函数会发出警报，然后调用函数 start。

【讨论】：

【解决方案4】：

尝试改变

$$(document).on('deviceready', function() {
    // Your content here
    });

对于

  $$(document).on('DOMContentLoaded', function(){
     // Your content here
    });

【讨论】：