jquerymobile - include .js and .html
- by Girija
Hi,
I have described the my problem in the following lines. Kindly clarify me. In my application,I am using more than html page for displaying the content and each page have own .js file. When I call the html page then .js file also included. In the .js,I am using $('div').live('pageshow',function(){}). I am calling the html file from the .js(using $.mobile.changePage("htmlpage")).
My problem : consider, I have two html files. second.html file is called with in the one.js. when I show the second.html, that time one.js is reload again. I am getting the alert "one.js" then "second.js"
Please help me. Thanks in advance. Please point out my mistake.
I have attached the code.
one.html
<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
<link rel="stylesheet" href="jquery.mobile-1.0a2.min.css" />
<script src="jquery-1.4.3.min.js"></script>
<script src="jquery.mobile-1.0a2.min.js"></script>
<script src="Scripts/one.js"></script>
</head>
<body>
<div data-role="page">
</div>
</body>
</html>
Second.html
<!DOCTYPE html>
<html>
<head>
<title>Sample </title>
<link rel="stylesheet" href="../jquery.mobile-1.0a2.min.css" />
<script src="../jquery-1.4.3.min.js"></script>
<script src="../jquery.mobile-1.0a2.min.js"></script>
<script type="text/javascript" src="Scripts/second.js"></script>
</head>
<body>
<div data-role="page">
<div data-role="button" id="link" >Second</div>
</div><!-- /page -->
</body>
</html>
one.js
$('div').live('pageshow',function()
{
alert("one.js");
//AJAX Calling
//success result than call the second.html
$.mobile.changePage("second.html");
});
second.js
$('div').live('pageshow',function(){
{
alert('second.js');
//AJAX Calling
//success result than call the second.html
$.mobile.changePage("third.html");
});
Note : When I show forth.html that time the following files are reload(one.js,second.js,third,js and fourth.js. But I need fourth.js alone). I tried to use the $.document.ready(function(){}); but that time .js did not call. :( :( :(