I am using phonegap, and this code loads perfectly in my android mobile.But When i click the button it does not shows the text.
try using this:
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript" charset="utf-8" src="cordova-2.4.0.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js">
</script>
<script>
$(document).on('pageinit', function(event){
$("#btn1").click(function(){
$("#test1").text("Hello world!");
});
});
</script>
<script src="http://code.jquery.com/mobile/1.3.0/jquery.mobile-1.3.0.min.js">
</script>
</head>
<body>
<p id="test1"></p>
<button id="btn1">Set Text</button>
</body>
</html>
Instead of doc ready
use pageinit
of jQuerymobile if developing for mobile apps.
When working with mobile devices, it is greatly recommended that you use the mobile version of jquery, jquery.mobile.js
Then you can use vclick and everything works fine:
Normalized event for handling touchend or mouse click events on touch devices.
$(document).ready(function(){
$("#btn1").vclick(function(){
$("#test1").text("Hello world!");
});
});
I don't think that JQuery is being loaded into the page.
You have referenced it as
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js">
which says use whatever protocol the current page is being server from. On a mobile device you are being served from file:// so the actual request the browser makes to fetch the script is:
file://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js
You need to specify the scheme you want to use or else include it in the PG project itself.