Menu
I am trying to change pages based on specific time interval. I tried using setTimeout, but it run the code immediately regardless the specified time. Here is the page:
<!DOCTYPE HTML>
<html>
<head>
<meta name="viewport" content="width=320; user-scalable=no" />
<meta http-equiv="Content-type" content="text/html; charset=utf-8">
<title>Change Page</title>
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.1.0/jquery.mobile-1.1.0.min.css" />
<script src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
<script type="text/javascript">
var oCSS = {
'font-size' : '18em',
'height' : '300px',
'border' : 'thick solid',
'text-align' : 'center'
};
$(document).bind("mobileinit", function()
{
$.mobile.defaultPageTransition = "flip";
});
$('div[data-role|="page"]').live('pageshow', function(event)
{
setTimeout($.mobile.changePage($($(this).attr('NextPage'))), 30000);
});
</script>
<script src="http://code.jquery.com/mobile/1.1.0/jquery.mobile-1.1.0.min.js"></script>
</head>
<body>
<div data-role="page" id="page1" NextPage='#page2'>
<div data-role="content">
<div class="number">4</div>
</div>
</div>
<div data-role="page" id="page2" NextPage='#page3'>
<div data-role="content">
<div class='number'>3</div>
</div>
</div>
<div data-role="page" id="page3" NextPage='#page4'>
<div data-role="content">
<div class='number'>2</div>
</div>
</div>
<div data-role="page" id="page4" NextPage='#page1'>
<div data-role="content">
<div class='number'>1</div>
</div>
</div>
<script type="text/javascript">
$(".number").css(oCSS);
</script>
</body>
</html>
608
Your syntax is incorrect. You need to use an anonymous function or the JS will be called immediately. In addition, your jQuery seems to be incorrect as well (one too many $()). It should be:
$('div[data-role|="page"]').live('pageshow', function(event)
{
// Retrieve attribute of element to be passed to anonymous function
var functionParam = $(this).attr('NextPage')
setTimeout(function() {
// Pass functionParam to function - $(this) will
// be out of scope when the function is called
$.mobile.changePage(functionParam)
}, 30000);
});
See window.setTimeout docs for further information.
157
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
