如何停止此循环？
<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功能停止此操作。
<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;
var intervalId = null;
$("#claim").html(classes[i]);
var funcName = function() {
i = (i + 1) % classes.length;
$("#claim").html(classes[i]);
if(classes.length == i + 1) {
clearInterval(intervalId);
}
};
intervalId = setInterval(funcName, 800);
</script>