admin管理员组文章数量:1326508
I have a simple PhoneGap application as fallows:
<!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>
What happens here is that the alert alert ('123'); never gets fired. But if I take out the other JavaScript code and leave only the alert it is fired.
Also if I use $(document).ready(function () { alert ('123'); } I get the alert.
What is happening here, why the deviceready is not getting fired?
Any ideas?
I have a simple PhoneGap application as fallows:
<!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>
What happens here is that the alert alert ('123'); never gets fired. But if I take out the other JavaScript code and leave only the alert it is fired.
Also if I use $(document).ready(function () { alert ('123'); } I get the alert.
What is happening here, why the deviceready is not getting fired?
Any ideas?
Share Improve this question edited Jan 24, 2012 at 7:43 gprathour 15.3k5 gold badges71 silver badges92 bronze badges asked Jan 24, 2012 at 6:13 PatrioticcowPatrioticcow 27k76 gold badges220 silver badges339 bronze badges 1 |13 Answers
Reset to default 16Try it this way :
document.addEventListener("deviceready", function(){
alert("123");
},true);
What @GPRathour provided works because document.addEventListener() is listening for deviceready, then if true, running your alert function. I didn't work how you had it because of two reasons:
1) when the DOM loaded and got down to your body tag it was calling OnDeviceReady() and the listener never got the call, so phonegap doesn't know it's ready to run.
2) you would have to call your listener from within a function and use 'false':
function init(){
document.addEventListener("deviceready", onDeviceReady, false);
}
function onDeviceReady(){
alert('123');
}
<body onload="onDeviceReady()"></body>
Check out the phonegap API as to why to use false instead of true in your listener, has to do with the default setting, but it's worth the read to understand how phonegap listeners work.
Just in case you have the same problem as me, I didn't know is needed to include the cordova.js script in your index.html, you don't have to provide the file or the reference, just include this line:
<script type="text/javascript" charset="utf-8" src="cordova.js"></script>
and then Cordova will use the library when compiling, after that the event is dispatched.
this code work for me
<body onload="init()"></body>
function init() {
document.addEventListener("deviceready", onDeviceReady, false);
}
function onDeviceReady() {
// Now safe to use the Cordova API
}
happy coding.......
When using PhoneGap 3.0 with WP8 Device Ready will not work because Phonegap.js is NOT INCLUDED in the Visual Studio solution.
The solution is to include it manually for now.
Add you event listener for deviceready inside you doc ready...
<script type="text/javascript" charset="utf-8">
$(document).ready(function () {
document.addEventListener("deviceready", onDeviceReady, true);
});
function onDeviceReady() {
alert ('123');
}
</script>
You dont want to call onDeviceReady() as this will run the function when you add the listener...
The main reason for unfired ondeviceready event on one or more platform, is when you try use cordova/phonegap js of the wrong platform.
Check the versions of the Cordova/phonegap library/jar files that you have added with the project (under libs) and the < script src="~/Scripts/cordova-3.0.0.js"/> script that you are referring in the HTML files. If there is a mismatch, the < script/> may not be able to refer it in the project. So that cordova fails to execute it's functionality.
In my case, I needed to remove meta http-equiv="Content-Security-Policy" content="...
You're binding a handler to deviceready before you've defined the handler.
Correct would be:
function onDeviceReady(){
alert('123')
}
document.addEventListener("deviceready", onDeviceReady, false);
And obviously your phonegap-2.0.0.js file (or other version) should be included in the file before this point.
Make sure below path is correct and both are need to be included into 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>
I'm see in your code one problem, in the method, you need add onDeviceReady() equals here:
document.addEventListener("deviceready", onDeviceReady(), false);
that worked for me!!
Biggest problem with PhoneGap examples are incorrect javascript syntax. Please be careful with this.. for this question,onDeviceReady should have braces...
document.addEventListener("deviceready", onDeviceReady(), true);
function onDeviceReady() {
alert ('123');
}
本文标签： javascriptdeviceReady not working in PhoneGap applicationhow toStack Overflow
版权声明：本文标题：javascript - deviceReady not working in PhoneGap application, how to? - Stack Overflow 内容由网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：http://www.betaflare.com/web/1737253356a1969339.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。
document.addEventListener(...)call and it should work. – Timo Ernst Commented Dec 13, 2012 at 11:22