I'm loading an external URL with PhoneGap 2.5, and trying to figure out why the deviceready event isn't consistently firing. There are a bunch of threads that all involved people not correctly adding the handlers, but I've done the following:
Put an onload handler on body where I do document.addEventListener("deviceready", onDeviceReady, false);
Used jQuery's document.ready function to set the event listener.
Called setTimeout in a loop waiting on navigator.splashscreen.
When does the deviceready event actually fire? Does loading a non-index.html page cause weird interactions? I see messages like Resetting plugins due to page load. and I'm wondering if that causes other problems.
Related
I have an aspx file, in which a button calls for javascript funtion. inside the javascript function i am making an ajax request. which will be opened inside an inappbrowser cordova plugin for ios.
this ajax request changes the DOM. is there a webkit eventhandler which i could use to handle the request inside inappbrowser.
I have an Electron app wrapping a remote site, and it works wonderfully.
I'm author and have access to all of the code in both ends.
I use contextBridge and ipcRenderer to send messages from the remotes clientside javascript to the electron app.
Using webContents.send and ipcRenderer I can also access the entire dom so I can use the remotes javascript functions indirectly. Fx with this code snippet:
ipcRenderer.on("message", (e, args) => {
switch (args.action) {
case "logout":
document.querySelector(".btn-logout").click();
break;
...
the above "click" is triggering an eventlistener which calls a "logout"-function.
But is it possible to access the clientside javascript functions of that remote site directly?
I simply want to get my Electron app to call a function that's defined in the remotes clientside javascript. So instead of triggering a click on the logout button, I would simply like to call the logout function. But I don't know howto.
Thanks in advance!
I'm binding to the jQuery Mobile pageinit event to do some additional stuff after a page has been created/enhanced and loaded into the DOM (per the docs) like so:
$('#home').live('pageinit', function()
{
...
};
But, all I'm getting is a white spinner and the page never displays on an iOS device running OS6. It works fine in the simulator. What could I be doing wrong?
There are plenty of references to pageinit not working if placed in the wrong part of the page, though generally that wouldn't cause the page to stop loading.
A script error in the event handler (the ... part) could cause the symptoms described, but would likely work the same in the simulator.
Are you sure all the files are referenced correctly? Unlike OSX, iOS is case sensitive, so a reference to jQuery.js instead of jquery.js will cause problems that you can't see anywhere else. You should be able to connect the desktop safari web inspector to the app to find any load errors.
I've got a Phonegap & jQuery Mobile app that works nicely on Android and web. On iOS I am getting unexpected results, which seem to be caused by the fact that the document.pageinit event to which I bind the handler for most of the app's processes is fired twice.
No, I didn't bind it twice. No, I didn't use document.ready. Yes, I did bind it to the document, early on in the script and not inside any other function.
$(document).on('pageinit',function(event){
alert(' Pageinit on document');
//Some more code
})
The first time it fires, the splash screen is still showing. At this point, while testing on a MacBook Pro with XCode, the console is not even avaiable: the above message didn't show up in the console when I used console.log.
Second time around, the fires shortly after jQueryMobile has created the first page.
What is causing this double firing and what can I do about it?
EDIT: I noticed later on that pageinit doesn't just fire a second time, but every time I open a new data-role='page' div. See my answer below.
I appreciate Zoltans answer and it may be relevant in some cases, but that was not the cause.
$(document).on('pageinit') will fire for every page transition used in your jQuery Mobile app. This will happen both with HTML links and when using $.mobile.changePage();.
Shockingly, the docs don't mention this anywhere: they advise you to use it without mentioning that it will fire for every subsequent page.
I can't believe that they are framing this problematic example as a valid equivalent of $(document).ready().
They should be advising you to bind using .one() instead of .bind() or on() to avoid multiple code execution.
It happens because i think you use jquery and jquery mobile together.
But the solution is simple. Try
$(document:not(.processed)).addClass('processed').on('pageinit',function(event)
This should solve it
Edit body to <body data-role="page"> should solve the problem.
I was struggling with that problem too long to not share with others. And I think it is not only problem under iOS but under Android as well (it caused flickering in my case).
"pageinit" event was called twice each time a request has been made. First one was the proper one to get data for provided url, another one was called after new page was loaded into DOM (jQueryMobile page dynamically injected into document). I think there are more solutions to solve this problem, here goes mine:
$(document).ready(function(){
$(this).delegate("#page-selector", "pageinit", function(ev, data){});
// I don't know why the line has to be present, but otherwise does not work
});
And my HTML document looks like:
<html>
<head>...here goes scripts...</head>
<body>
<div id="#page-selector"> <!-- just wrapper -->
<div data-role="page">
... content...
</div>
</div>
</body>
</html>
I hope it will spare precious time for others!
I'm building my first jquery mobile site and have run into a problem. When just doing a straightforward hyperlink from one page to another it seems like the page transition effect is stopping the
$(document).ready(function(){
alert("hello");
});
From firing. If I refresh the page or link to the page directly the event fires.
I've tried removing the data-transition from the hyperlink and even tried
<a data-role="button" data-transition="none" href="/otherpage/">link</a>
But still have the same problem.
Andy ideas please? Thanks.
This is by design, as jQuery Mobile loads pages in the background, then incorporates them in the current document before transitioning. This means the original page is not reloaded, so the document does not become ready again.
Accordingly, the documentation on events prominently says (emphasis from original):
Important: Use $(document).bind('pageinit'), not $(document).ready()
Therefore, you should write:
$(document).bind("pageinit", function() {
alert("hello");
});