web-dev-qa-db-fra.com

deviceReady ne fonctionne pas dans l'application PhoneGap, comment faire?

J'ai une application PhoneGap simple en jachère:

<!DOCTYPE HTML>
<html>
    <head>
        <title>PhoneGap powered App</title>
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <link rel="stylesheet" href="css/jquery.mobile-1.0.min.css" />
        <script type="text/javascript" charset="utf-8" src="phonegap-1.3.0.js"></script>
        <script src="js/jquery-1.7.1.min.js"></script>
        <script src="js/jquery.mobile-1.0.min.js"></script>


    <script type="text/javascript" charset="utf-8">

        document.addEventListener("deviceready", onDeviceReady, true); 
        function onDeviceReady() {
            alert ('123');
        }
    </script>

    </head>
    <body onload="onDeviceReady()">
        <div data-role="page">

            <div data-role="header">
                <h1>title</h1>
            </div><!-- /header -->

            <div data-role="content">   
                <h2>Begin by inserting your credentials.</h2>
                ...
            </div><!-- /content -->

        </div><!-- /page -->

        <script type="text/javascript" charset="utf-8">
            $(document).ready(function () {

            });
        </script>
    </body>
</html>

Ce qui se passe ici est que l'alerte alert ('123'); n'est jamais déclenchée. Mais si je sors l'autre code JavaScript et ne laisse que l'alerte, il est déclenché.

Aussi, si j'utilise $(document).ready(function () { alert ('123'); }, je reçois l'alerte.

Que se passe-t-il ici, pourquoi la deviceready ne se fait pas virer?

Des idées?

javascriptjqueryandroidcordova
18
Patrioticcow

Essayez de cette façon:

 document.addEventListener("deviceready", function(){
      alert("123");
 },true);
17
gprathour

Ce que @GPRathour a fourni fonctionne parce que document.addEventListener() est à l'écoute de deviceready, puis, si true, en exécutant votre fonction d'alerte. Je n'ai pas travaillé comme vous l'avez eu pour deux raisons:

1) lorsque le DOM a chargé et rejoint votre balise body, il appelait OnDeviceReady () et l’auditeur n’a jamais reçu l’appel, donc phonegap ne sait pas qu’il est prêt à fonctionner.

2) vous devez appeler votre auditeur depuis une fonction et utiliser 'false':

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

function onDeviceReady(){
  alert('123');
}

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

Découvrez dans l'API de Phonegap pourquoi utiliser false au lieu de true dans votre programme d'écoute. Cela a à voir avec le paramètre par défaut, mais il vaut la peine de le lire pour comprendre le fonctionnement des écouteurs de Phonegap.

16
Godzilla74

Juste au cas où vous auriez le même problème que moi, je ne savais pas qu'il était nécessaire d'inclure le script cordova.js dans votre index.html, vous n'avez pas à fournir le fichier ou la référence, vous devez simplement inclure cette ligne:

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

cordova utilisera ensuite la bibliothèque lors de la compilation, après quoi l'événement sera distribué.

9
Jose Ignacio Hita

ce code fonctionne pour moi

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

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

codage heureux .......

6
kathir

Lorsque vous utilisez PhoneGap 3.0 avec WP8 Device Ready ne fonctionnera pas car Phonegap.js n'est pas inclus dans la solution Visual Studio. 

La solution consiste à l'inclure manuellement pour l'instant.

5
Michael

La raison principale de la non-activation de l'événement ondeviceready sur une ou plusieurs plates-formes est lorsque vous essayez d'utiliser cordova/phonegap js sur une plate-forme incorrecte.

2
Idan Gozlan

Ajoutez votre écouteur d'événement pour deviceready dans votre doc ready ...

<script type="text/javascript" charset="utf-8">
    $(document).ready(function () {
         document.addEventListener("deviceready", onDeviceReady, true); 
    });

    function onDeviceReady() {
        alert ('123');
    }
</script>

Vous ne voulez pas appeler onDeviceReady () car cela lancera la fonction lorsque vous ajouterez le listener ...

2
nodrog

Dans mon cas, je devais supprimer Meta http-equiv = "Content-Security-Policy" content = "...

1
A. Soufi

Vérifiez les versions des fichiers Cordova/phonegap library/jar que vous avez ajoutés au projet (sous libs) et le script <script src = "~/Scripts/cordova-3.0.0.js" /> auquel vous vous référez. les fichiers HTML. En cas d'incompatibilité, le <script /> peut ne pas être en mesure de le faire référence dans le projet. Donc, Cordova ne parvient pas à exécuter ses fonctionnalités.

1
Ramajayam Ramalingam

Je vois dans votre code un problème, dans la méthode, vous devez ajouter onDeviceReady() est égal ici:

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

cela a fonctionné pour moi !!

0
Tales Born

Assurez-vous que le chemin ci-dessous est correct et que les deux doivent être inclus dans le langage HTML:

        <script type="text/javascript"  src="cordova.js"></script>
        <script src="js/jquery-1.11.2.min.js"></script>

  <script type="text/javascript">
        $(document).ready(function(){
        document.addEventListener("deviceready", onDeviceReady, false);
        });

        function onDeviceReady() {
        alert("inside onDeviceReady");
        }
        </script>
0
KOTIOS