All geek questions in one place

Phonegap does not work in Android emulator

I followed all the steps of the main Phonegap tutorial (Eclipse, Android SDK, ADT Phonegap), I created the HMTL page in the assets / www folder, launched it and showed my hello world html .

Step 2: I added a link to jQuery Mobile on the CDN in my HTML page: it worked.

Step 3: I created a new html page, copied the code below, which is a sample from the Phonegap website, and it’s nothing ... nothing. Even a warning (I added some warnings to find out if something happened, but even the onDeviceReady event does not fire.

I have a Phonegap JAR, cordova-1.7.0.js in my assest/www directory, but something is probably missing.

Can someone help me?

I also tried another sample from the Phonegap website (sample device properties), but it still doesn't work.

This is a new installation of Eclipse, I installed the Android version on 2.3.3 and I use Phonegap 1.7.0.

=================

EDIT

I tried a little more, and now I can reproduce the error, but I do not know why this is happening.

So, I created a new project using the Phonegap sample project, it works.

So, I copied all the assets from this project (1 html, 2 js and 1 css) to my projects so that the application starts with this html (from my activity class) and it works.

And now for the fun part (not): I reset the start page for my "old" index.html (which is jQuery mobile), and then clicked a link to an html example, it does NOT work.

So, the html example is like startup: it works, the html example opened by reference: DOES NOT work.

And when I loaded other other html pages that didn't work as a start page, instead of opening them through the start page, they work too.

So, is it possible that my jQuery mobile index page is causing problems? (I will copy the code below).

EDIT2: When I use the non-jQuery Mobile index page and I link to a regular <A href> for example html, it also works. So more and more hints that I think jQuery mobile is in my way ...

Link Code:

 <li><a href="index4.html" data-transition="none">phonegap example</a></li>

JQuery Mobile Homepage:

 <html> <head> <title></title> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="stylesheet" href="http://code.jquery.com/mobile/1.0.1/jquery.mobile-1.0.1.min.css" /> <link rel="stylesheet" href="http://www.verfrisser.net/kalender/mobile/verfrisser.css" /> <script src="http://code.jquery.com/jquery-1.6.4.min.js"></script> <script src="http://code.jquery.com/mobile/1.0.1/jquery.mobile-1.0.1.min.js"></script> <script type="text/javascript" charset="utf-8" src="cordova-1.7.0.js"></script> </head> <body> <div data-role="page"> <div data-role="header"> <h1>De NerdNight kalender</h1> <a href="about.html" data-rel="dialog">About</a><a href="genereren.html" data-transition="pop">Genereren</a> </div><!-- /header --> <div data-role="content"> <img id="verfrisserlogo" src="verfrisserlogo.png" /> <ul data-role="listview" data-inset="true" data-filter="false"> <li><a href="2011.html" data-transition="none">2011</a></li> <li><a href="2012.html" data-transition="none">2012</a></li> <li><a href="2013.html" data-transition="none">2013</a></li> <li><a href="testing.html" data-transition="none">testing</a></li> <li><a href="testing2.html" data-transition="none">testing2</a></li> <li><a href="testing3.html" data-transition="none">testing3</a></li> <li><a href="index4.html" data-transition="none">phonegap example</a></li> </ul> </div><!-- /content --> <div data-role="footer"> <h6>(C) Verfrisser 1998 till now</h6> </div><!-- /footer --> </div><!-- /page --> </body> </html>

=================

HTML sample (which displays only the text “A dialog box will report network status” on the page)

 <!DOCTYPE html> <html> <head> <title>navigator.network.connection.type Example</title> <script type="text/javascript" charset="utf-8" src="cordova-1.7.0.js"></script> <script type="text/javascript" charset="utf-8"> // Wait for Cordova to load // document.addEventListener("deviceready", onDeviceReady, false); // Cordova is loaded and it is now safe to make calls Cordova methods alert ('stand alone'); // function onDeviceReady() { alert ('onDeviceReady'); checkConnection(); } function checkConnection() { var networkState = navigator.network.connection.type; var states = {}; states[Connection.UNKNOWN] = 'Unknown connection'; states[Connection.ETHERNET] = 'Ethernet connection'; states[Connection.WIFI] = 'WiFi connection'; states[Connection.CELL_2G] = 'Cell 2G connection'; states[Connection.CELL_3G] = 'Cell 3G connection'; states[Connection.CELL_4G] = 'Cell 4G connection'; states[Connection.NONE] = 'No network connection'; alert('Connection type: ' + states[networkState]); } </script> </head> <body> <p>A dialog box will report the network state.</p> </body> </html>
+6
source share
3 answers

With the default behavior, the next page will load as a DOM element, so javascript deviceready will no longer be called.

Try one of these methods to start it in the usual way:

 <li><a href="testing2.html" data-transition="none" rel="external">testing2</a></li>

or

 <li><a href="testing2.html" data-transition="none" data-ajax="false">testing2</a></li>

Explanation:

When a link is clicked, jQuery mobile will ensure that the link is referencing the local URL, and if so, this will prevent the default link from clicking behavior from happening and request the link URL via Ajax instead. When the page returns successfully, it will set location.hash to the new page URL.

If the Ajax request is successfully completed, the contents of the new page are added to the DOM, all mobile widgets are automatically initialized, and then the new page is animated in the page transition view.

For more details check doc

+9
source

As far as there is no error in your code. This code structure is not well built. You mentioned mobile phone and jQuery mobile javascript at the beginning of the first page, not the second page. It has no javascript javascript file in the head.

Facts from my knowledge:

  • You can perform a jquery transition from one jquery mobile page to another jquery mobile attached page.
  • Include standard library files in both headers.

It will do your job.

+1
source

After adding the xml files mentioned in @Coder_sLaY, you need to add the server from which you download the jQuery Mobile JS file (CDN URL) to the white list of allowed servers in the cordova.xml file

0
source

Source: https://habr.com/ru/post/917486/

More articles:


All Articles