我正在尝试根据特定时间间隔更改页面。 我尝试使用 setTimeout，但无论指定时间如何，它都会立即运行代码。 这是页面:
<!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>
最佳答案
您的语法不正确。您需要使用匿名函数，否则将立即调用 JS。此外，您的 jQuery 似乎也不正确($() 太多了)。应该是:
$('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);
});
参见 window.setTimeout docs了解更多信息。
关于javascript - setTimeout 不等待 JQuery Mobile 中的指定时间间隔，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/10397099/