我怎样才能停止这个循环?
<body>
<div class="container">
<div id="claim"></div>
</div>
<script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
<script>
var classes = [
'<h1 >Software</h1>',
'<h1 >project </h1>',
'<h1 >Engineering</h1>',
'<h1 >Science</h1>',
'<img src="https://img.icons8.com/material/4ac144/256/user-male.png">'
];
var i = 0;
$("#claim").html(classes[i]);
setInterval(function() {
i = (i + 1) % classes.length;
$("#claim").html(classes[i]);
}, 800);
</script>
</body>
脚本运行正常,但我想在最后停止它。
提前致谢
您可以使用 clearInterval()
取消之前通过调用 setInterval()
建立的定时重复操作。
var classes = [
'<h1 >Software</h1>',
'<h1 >project </h1>',
'<h1 >Engineering</h1>',
'<h1 >Science</h1>',
'<img src="https://img.icons8.com/material/4ac144/256/user-male.png">'
];
var i = 0;
$("#claim").html(classes[i]);
var interval = setInterval(function() {
if(i == classes.length - 2){ // stop at the end item
clearInterval(interval);
}
i = (i + 1) % classes.length;
$("#claim").html(classes[i]);
}, 800);
<div class="container">
<div id="claim"></div>
</div>
<script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
我是一名优秀的程序员,十分优秀!