setInterval在jquery移动不工作
问题描述:
我想在jQuery手机页面上每10秒后触发一个事件。但是setInterval()似乎不起作用。即使在页面加载完成之前,alert()也会显示。setInterval在jquery移动不工作
这是我的代码
$(document).on("pageshow", function(event) {
setInterval(update(), 10000);
function update() {
alert("Hey");
}
});
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- Include jQuery Mobile stylesheets -->
<link rel="stylesheet" href="https://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css">
<!-- Include the jQuery library -->
<script src="https://code.jquery.com/jquery-1.11.3.min.js"></script>
<!-- Include the jQuery Mobile library -->
<script src="https://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script>
<div data-role="page" id="chat">
<div data-role="header">
<a href="#panel1" class="ui-btn-left ui-btn ui-btn-inline ui-mini ui-corner-all ui-btn-icon-left ui-icon-gear">Options</a>
<h1>Streamline Chat</h1>
<a data-ajax="false" href="logout.php" class="ui-btn ui-btn-inline ui-mini ui-corner-all ui-btn-icon-right ui-icon-power">Log Out</a>
</div>
</div>
任何帮助吗?
答
内检查您只能回调传递给setInterval
https://developer.mozilla.org/en-US/docs/Web/API/WindowOrWorkerGlobalScope/setInterval
$(document).on("pageshow",function(event){
setInterval(update, 1000);
function update()
{
console.info("Hey");
}
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script>
<html>
<head>
<meta charset="utf-8">
<title>Streamline Chat</title>
<!-- Include meta tag to ensure proper rendering and touch zooming -->
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- Include jQuery Mobile stylesheets -->
<link rel="stylesheet" href="https://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css">
<!-- Include the jQuery library -->
<script src="https://code.jquery.com/jquery-1.11.3.min.js"></script>
<!-- Include the jQuery Mobile library -->
<script src="https://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script>
</head>
<body>
<div data-role="page" id="chat">
<div data-role="header">
<a href="#panel1" class="ui-btn-left ui-btn ui-btn-inline ui-mini ui-corner-all ui-btn-icon-left ui-icon-gear">Options</a>
<h1>Streamline Chat</h1>
<a data-ajax="false" href="logout.php" class="ui-btn ui-btn-inline ui-mini ui-corner-all ui-btn-icon-right ui-icon-power">Log Out</a>
</div>
</div>
</body>
</html>
答
您可以通过update()
去除()
的setInterval
setInterval(update, 10000);
function update() {
alert("Hey");
}
});
答
应该update
不update()
在setInterval
$(document).on("pageshow",function(event){
setInterval(update, 10000);
function update()
{
alert("Hey");
}
});
答
相信这已经回答了上面的现在,而是将来的参考或其他任何人读这篇文章,这里是一个小功能,我写的,使呼叫超时点点整洁:
功能:
function timeItOut(time, args, params1, params2){
setTimeout(function(){
// add more parameters as per your function with the most params
args(params1, params2);
}, time)
}
用法:
// Occurs after 4 seconds
timeItOut(4000, animateLights, device);
// Occurs after 7 seconds
timeItOut(7000, scrollScreen, 140);
显然你可以在timeItOut函数中添加更多'params',这只是我在这个脚本中使用的最大参数数量。
答
尝试使用
“为什么我们只需要创建一个setInterval
?有许多优点。也许最重要的是,它在用户导航到另一个浏览器选项卡,因此没有浪费自己宝贵的暂停处理能力和电池寿命。
function update()
{
alert("Hey");
requestAnimationFrame(update);
}
它已经在工作同样的代码[这里](https://jsfiddle.net/p9h7d793/7/) – rahulsm