1

ご覧ください。この問題を解決するのに役立ちます。私は2日間頭痛に悩まされました。関数 onDeviceReady が呼び出されることはありません。これが私のコードです：

    <!DOCTYPE HTML>
<html>
    <head>
        <meta charset="UTF-8">
            <title>DemoSimpleControls</title>
            <meta name="viewport"
                content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=0">
                <link rel="shortcut icon" href="images/favicon.png">
                    <link rel="apple-touch-icon" href="images/apple-touch-icon.png">
                        <link href="jqueryMobile/jquery.mobile-1.3.0.css" rel="stylesheet">
                            <link rel="stylesheet" href="css/DemoSimpleControls.css">

                                <script src="jqueryMobile/jquery.mobile-1.3.0.js"></script>
                                <script src="../js/jquery-1.9.1.min.js"></script>
                                < script  type="text/javascript" charset="utf-8" src="../cordova-2.5.0.js"></script>
                                <script type="text/javascript" charset="utf-8">
                                    $(document).ready(function() {
                                                      // Handler for .ready() called.
                                                      document.addEventListener("deviceready", onDeviceReady, true);
                                                      });
                                    $(function() {
                                      document.addEventListener("deviceready", onDeviceReady, true);
                                      });
                                    function onDeviceReady(){
                                        alert("ready");
                                        $("#mysavedData").html("XYZ");
                                        $("#mysavedData").html(window.localStorage.getItem("data"));
                                    }

                                </script>
                                </head>

    <body id="content" onLoad="onLoad();" >
        <div data-role="page" id="page">
            <div data-role="header" >
                <a data-rel="back" href="#" >Back</a>
                <h1>My page</h1>

            </div>
            <div data-role="content" style="padding: 15px" data-theme="e">
                <div id="mysavedData">My data</div>

            </div>

        </div>
    </body>
</html>
4

4 に答える 4

4

そのイベントは恐ろしく、使用する価値がないほど多くの問題があります。代わりに、PhoneGap の準備ができるまでポーリングして、window.device.

デモ： jsフィドル

Javascript:

function initializePhoneGap( success, failure ) {
    var timer = window.setInterval( function () {
        if ( window.device ) {
            window.clearInterval( timer );
            success();
        };
    }, 100 );
    window.setTimeout( function () { //failsafe
        if ( !window.device ) { //phonegap failed
            window.clearInterval( timer );
            failure();
        };
    }, 5000 ); //5 seconds
};

window.onload = function () {
    initializePhoneGap( function success() {
        //start app
        document.getElementById( 'result' ).textContent = 'phonegap: success';
    }, function failure() {
        //phonegap failed 
        document.getElementById( 'result' ).textContent = 'phonegap: failure';
    } );

};

HTML:

should fail on desktop after 5 seconds
<div id="result">phonegap:</div>
于 2013-03-25T05:42:36.990 に答える
1

このコードは私のために働く

<body onload="init()"></body>

function init() {
    document.addEventListener("deviceready", onDeviceReady, false);
}
function onDeviceReady() {
    // Now safe to use the Cordova API
}

幸せなコーディング.......

于 2014-04-08T14:29:17.870 に答える
1

PhoneGap Web サイトの次の例を見てください。イベント リスナーを onLoad() に配置し、jQuery の準備完了関数から削除します。

<script type="text/javascript" charset="utf-8" src="cordova-2.5.0.js"></script>
<script type="text/javascript" charset="utf-8">

// Call onDeviceReady when Cordova is loaded.
//
// At this point, the document has loaded but cordova-2.5.0.js has not.
// When Cordova is loaded and talking with the native device,
// it will call the event `deviceready`.
//
function onLoad() {
    document.addEventListener("deviceready", onDeviceReady, false);
}

// Cordova is loaded and it is now safe to make calls Cordova methods
//
function onDeviceReady() {
    // Now safe to use the Cordova API
}

</script>

説明: Cordova は、ネイティブと JavaScript の 2 つのコード ベースで構成されています。ネイティブ コードの読み込み中は、カスタムの読み込みイメージが表示されます。ただし、JavaScript は DOM がロードされた後にのみロードされます。これは、Web アプリケーションが、ロードされる前に Cordova JavaScript 関数を呼び出す可能性があることを意味します。

Cordova が完全に読み込まれると、Cordova deviceready イベントが発生します。デバイスが起動したら、Cordova 関数を安全に呼び出すことができます。

通常、HTML ドキュメントの DOM がロードされたら、document.addEventListener を使用してイベント リスナーをアタッチします。

于 2013-03-25T05:22:46.907 に答える
1

phonegap.jsこのイベントを発生させるには、ファイルも含める必要があることを知らないようです。また、
私のように使用して、最初にビューが読み込まれ、次にアプリが phonegap を処理するようにします。そうしないと、ユーザーはさらに待つ必要があります。

<html>
  <head>
  ....
  <title>Index file</title>
   </head>
 <body>
   ....


    <script type="text/javascript" src="phonegap.js"></script> //you forgot this
</body>
</html>
于 2014-04-29T09:36:01.970 に答える