Javascript 如何在特定元素之后激活clearInterval（）？

我有五个正方形。当我单击按钮时，方块会随着

setInterval

上下移动。函数

clearInterval

工作正常。但我真正想要的是当我点击激活

clearInterval

时，在最后一个方块关闭后工作的方法

HTML代码如下所示：

<div id="box-holder" class="down">
    <ul>
        <li></li>
        <li></li>
        <li></li>
        <li></li>
        <li></li>
    </ul>
</div>
<div id="button-group">
  <button id="btn-move" class="stopped">Move Box</button>
  <button id="btn-active">Active Click</button>
</div>

---

跟踪使用动画并具有“stopped”类的元素数。如果btn移动元素的数量与“停止”元素的数量相同，则所有元素都已停止。单击功能的更改如下：

$('#btn-active').click(function() {
    $(this).html('Stop');
    if( $('#btn-move').hasClass('stopped') ) {
        $('#btn-move').removeClass('stopped');
        startClick();
    } else {
        $(this).html('Active Click');
        $('#btn-move').addClass('stopped');
        // stopClick();
        if($('#btn-move').length == $('#btn-move.stopped').length){ stopClick(); }
    }
});

---

听起来你需要一些承诺。。。我认为，虽然缺少太多的代码，无法提出完整的解决方案（例如，运动是如何执行的，如果您指的是动画，为什么不确定jQuery的内置动画）？

$('#btn-active').click(function() {
    $(this).html('Stop');
    if( $('#btn-move').hasClass('stopped') ) {
        $('#btn-move').removeClass('stopped');
        startClick();
    } else {
        $(this).html('Active Click');
        $('#btn-move').addClass('stopped');
        // stopClick();
        if($('#btn-move').length == $('#btn-move.stopped').length){ stopClick(); }
    }
});