PhoneGap Build deviceready 事件未触发答案

【问题标题】：PhoneGap Build deviceready event not firingPhoneGap Build deviceready 事件未触发
【发布时间】：2014-09-06 03:01:15
【问题描述】：

我正在使用 PhoneGap build 构建一个应用程序，并且我正在尝试根据 Adobe 的文档触发 deviceready 事件：http://docs.phonegap.com/en/1.0.0/phonegap_events_events.md.html#deviceready

我研究过这个问题，发现很多人都成功地克服了它。我尝试了以下方法：

我在我的 Index.html 中添加了以下几行：（我也尝试添加 cordova.js）

<script type="text/javascript" src="phonegap.js"></script>
<script type="text/javascript">
document.addEventListener("deviceready", function () { alert("Device Ready is Working"); }, false);
</script>

我已将以下内容添加到我的 config.xml 文件中：

<gap:plugin name="org.apache.cordova.device" />

应用加载并运行良好，但没有设备就绪警报。我已经在我的 Asus Transformer 和 Kindle Fire 上尝试过，但没有成功。

索引.html：

<!doctype html>
<html lang="en" ng-app="Stories">
<head>
    <meta name="viewport" content="initial-scale = 1.0,maximum-scale = 1.0" />
    <meta name="google-signin-clientid" content="615522017730.apps.googleusercontent.com" />
    <meta name="google-signin-scope" content="https://www.googleapis.com/auth/userinfo.email https://www.googleapis.com/auth/plus.login" />
    <meta name="google-signin-cookiepolicy" content="single_host_origin" />

    <link rel="Stylesheet" href="Styles/Lib/font-awesome.min.css" />
    <link rel="Stylesheet" href="Styles/Lib/bootstrap.min.css" />
    <link rel="Stylesheet" href="Styles/Core.css" />
    <link rel="Stylesheet" href="Styles/Mobile.css" />
</head>
<body>
    <div ng-view></div>

    <script type="text/javascript" src="Scripts/Lib/angular.min.js"></script>
    <script type="text/javascript" src="Scripts/Lib/angular-route.min.js"></script>

    <script type="text/javascript" src="Scripts/Lib/jquery-2.1.1.min.js"></script>
    <script type="text/javascript" src="Scripts/Lib/jquery.cookie.js"></script>
    <script type="text/javascript" src="Scripts/Lib/bootstrap.min.js"></script>
    <script type="text/javascript" src="Scripts/Lib/moment.min.js"></script>
    <script type="text/javascript" src="Scripts/Lib/lodash.js"></script>
    <script type="text/javascript" src="Scripts/Lib/ui-bootstrap-0.10.0.js"></script>
    <script type="text/javascript" src="Scripts/Lib/ui-bootstrap-tpls-0.10.0.js"></script>

    <script type="text/javascript" src="Scripts/App/Core.js"></script>
    <script type="text/javascript" src="Scripts/App/Stories.js"></script>

    <script type="text/javascript" src="Scripts/App.js"></script>
    <script type="text/javascript" src="Scripts/Controllers.js"></script>
    <script type="text/javascript" src="Scripts/Directives.js"></script>
    <script type="text/javascript" src="Scripts/Services.js"></script>
    <script type="text/javascript" src="Scripts/BSDirectives.js"></script>

    <!--<script type="text/javascript" src="phonegap.js"></script>-->
    <script type="text/javascript" src="cordova.js"></script>
    <script type="text/javascript" src="Plugins/PushNotification.js"></script>

    <div id="fb-root"></div>

    <script type="text/javascript">
        document.addEventListener("deviceready", function () { alert("Device Ready is Working"); }, false);
    </script>

    <script type="text/javascript">
        window.fbAsyncInit = function () {
            // TODO: Fix Channel location
            FB.init({
                channelUrl: 'http://localhost:49499/stories/FBChannel.html',
                appId: '474111489382243',
                status: true,
                cookie: true,
                xfbml: true
            });
        };
        (function (d) {
            var js, id = 'facebook-jssdk', ref = d.getElementsByTagName('script')[0];
            if (d.getElementById(id)) { return; }
            js = d.createElement('script'); js.id = id; js.async = true;
            js.src = "//connect.facebook.net/en_US/all.js";
            ref.parentNode.insertBefore(js, ref);
        }(document));
    </script>

    <script type="text/javascript">
        (function () {
            var po = document.createElement('script');
            po.type = 'text/javascript'; po.async = true;
            po.src = 'https://apis.google.com/js/client:plusone.js?onload=render';
            var s = document.getElementsByTagName('script')[0];
            s.parentNode.insertBefore(po, s);
        })();
    </script>
</body>
</html>

config.xml：

<?xml version="1.0" encoding="utf-8" ?>
<widget 
xmlns="http://www.w3.org/ns/widgets" 
xmlns:gap="http://phonegap.com/ns/1.0" 
xmlns:android="http://schemas.android.com/apk/res/android"
id="com.asd.sdf" 
versionCode="1.0" 
version="1.0">
<name>asd</name>
<description>asd</description>
<author href="asd" email="asd">asd</author>
<access origin="*" />
<gap:plugin name="org.apache.cordova.device" />
</widget>

【问题讨论】：

可能只是警报没有出现，警报是通过phonegap完成的。您需要能够调试。试试 Weinre people.apache.org/~pmuellr/weinre-docs/latest 或在 IOS 上，您可以将 enulator 连接到 Safari phonegap-tips.com/articles/…。您需要查看 JS 控制台在说什么，否则处理事情会非常棘手。
你在浏览器中签到吗？？
创建一个新项目。默认模板会加载一个闪烁的图形，直到触发 deviceready 事件，然后告诉您一切顺利。正如 poperob 所说，警报不是测试事件处理程序的方法。
您查找了一个非常旧版本的文档。请务必始终选择 Phonegap 文档页面右上角的“边缘”。当前文档的正确链接是this one
谢谢你们的cmets，伙计们。 poperob 和 kindasimple 让我走上了正轨。警报只是没有触发。我重写了一些代码来更改页面上的 CSS 而不是显示警报，我看到了预期的结果。你能解释一下为什么警报不会触发吗？ Raj：不，正如我的问题所述，它是通过设备进行的。 qefzec：感谢您提供更新的链接。不过，实现看起来与我的问题完全相同。但是，感谢您传递该下拉列表的知识:)

标签： javascript android cordova

【解决方案1】：

我觉得这个答案看起来不错 -> Phonegap doesn't show alert

“因为您试图在加载 phonegap/cordova 框架之前显示警报。 $(document).ready(function(){ 在这里帮不了你，你必须使用这个事件来检查phonegap是否加载成功"

document.addEventListener("deviceReady", deviceReady, false);

function deviceReady() {
    // Now safe to use the PhoneGap API
}

【讨论】：

这与 OP 的代码有何不同？您只创建了一个单独的回调函数，但我相信它的工作方式完全相同。
是的，我实际上根本没有使用 jQuery 就绪事件，它实际上与我的代码相同，但带有回调。我的问题是为什么在 Cordova 准备好后警报不会触发。我不得不使用 UI 元素更改或 Weinre 来传递设备就绪状态，而不是提醒。