我有一个 html 幻灯片，每 10 秒轮换一次客户的广告，但是第一个广告总是从 20 秒开始显示。我认为这是因为 setInterval 从 10 秒开始，因此 select 语句仅在 10 秒后执行，因此第一个广告的时间加倍。
我需要 setInterval 从 0 秒开始。
这是我的设置间隔:
<script>
setInterval(function() {
$('#slideshow > div:first')
.fadeOut(0)
.next()
.fadeIn(0)
.end()
.appendTo('#slideshow');
}, 10000);
</script>
完整代码
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" lang="en-us" xml:lang="en-us">
<head>
<style>
body {
margin: 0;
}
</style>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"> </script>
<script>
function handler() {
$('#slideshow > div:first')
.fadeOut(0)
.next()
.fadeIn(0)
.end()
.appendTo('#slideshow');
}
handler();
setInterval(handler, 10000);
</script>
</head>
<body>
<?PHP
echo "<div id='slideshow'>";
//Getting ads from the database
require_once('connect_pdo.php');
$sqlst = $conn->prepare("SELECT ads from adlist");
$sqlst->execute();
while($resultst = $sqlst -> fetch()){
$adlist = $resultst["Monday_Morning"];
echo "<div class='slideshow'>";
//Display ad as an image
//<object data='/$adlist'></object>
echo "<iframe id='frame' src='/$adlist' style='position:fixed; top:0px; left:0px; bottom:0px; right:0px; width:100%; height:100%; border:none; margin:0; padding:0; overflow:hidden; z-index:999999; autoplay'>
Your browser doesnt support iframes
</iframe>";
echo "</div>";
}
echo "</div>";
?>
</body>
</html>
最佳答案
将 callback 定义为一个函数并调用它。还将它作为 setInterval
function handler() {
alert(); //Just for demo
$('#slideshow > div:first')
.fadeOut(0)
.next()
.fadeIn(0)
.end()
.appendTo('#slideshow');
}
handler();
setInterval(handler, 10000);<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>关于javascript - 从 0 开始 setInterval 循环，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/37541905/