Question

所以在我的代码中，如果一个元素没有做某事[playing]，那么我将开始播放它。如果正在播放，请停止播放。我设法让它开始播放，但它永远不会停止。

var playing = false;
var current = 30;
$('#countDownContainer').click(function() {
        if (!playing) {
            playing = false;
            setInterval(function() {
                $('#workSpace label').get(0).innerHTML = current;
                current -= 1;
            },1000);
        } else {
            playing = true;
        }
    });

理论上，当用户点击#countDownContainer时，playing将设置为false并运行setInterval代码，如果已经播放，则playing将设置为true当经历循环时它不会运行。但事实上，它不断从30更改为29并返回30。当我再次点击按钮时，它永远不会停止。请帮忙-thanks

Answer 1

var clear= setInterval(function() {
                    $('#workSpace label').get(0).innerHTML = current;
                    current -= 1;
                },1000);

    clearinterval(clear);// to stop interval where you want
    //clearInterval(id_of_setinterval)

参考clearInterval

Answer 2

首先，我认为你混淆了var playing作业。您还应该分配从setInterval返回的ID，以便稍后可以使用clearInterval中止该间隔循环：

//initialize var at the start of the script
var intervalID;

// in the onclick event
if (!playing) {
    playing = true; // should be true here
    intervalID = setInterval(function() {
        $('#workSpace label').get(0).innerHTML = current;
        current -= 1;
    },1000);
} else {
    playing = false; // should be false here
    clearInterval(intervalID);
}

请参阅documentation on clearInterval

Answer 3

这称为logic error。

因为请注意以下内容：

var playing = false;         // playing is initialised to false

if (!playing) {              // if not playing
        playing = false;     // set playing to false

因此playing永远不会成为true。

您可以通过执行以下操作来解决：

var playing = false;
var current = 30;
$('#countDownContainer').click(function() {
    if (playing) {
        playing = false;
    } else {
        playing = true;
         setInterval(function() {
            $('#workSpace label').get(0).innerHTML = current;
            current -= 1;
        },1000);
    }
});

或者说：

如果不是playing，我们会将其播放：playing = true;

如果playing，我们不会播放它：playing = false

<强>附录

关于停止问题，请参阅@Riturajratan他的问题。

间隔不断变化？

3 个答案: