Javascript 使用setInterval作为计数器

我试图创建一个页面，每10秒更改4次，然后重新开始。为此，我制作了一个计数器，并将其与函数一起传递。它甚至不像它的装载

我也尝试过使用

<script>
var i = 1;

function start(){
    i = setInterval(changeEdu, 10000, i);
}

function changeEdu(i){  
    if(i == 4){
        i = 1;
    }else{
        i++;
    }

    document.getElementById("edu1").src = "left" + i + ".jpg";
    document.getElementById("edu2").src = "right" + i + ".jpg";

    return i;
}

</script>

var i=1；
函数start（）{
i=设置间隔（更改为10000，i）；
}
函数更改u（i）{
如果（i==4）{
i=1；
}否则{
i++；
}
document.getElementById（“edu1”）.src=“left”+i+”.jpg；
document.getElementById（“edu2”）.src=“right”+i+”.jpg；
返回i；
}

通过将

i

声明为函数的参数，您的增量将只改变局部变量，而不是全局状态。同时，返回值也被忽略

var i = 1;

function start() {
    setInterval(changeEdu, 10000);
}

function changeEdu() {
//                ^^
    if (i == 4) {
        i = 1;
    } else {
        i++;
    }

    document.getElementById("edu1").src = "left" + i + ".jpg";
    document.getElementById("edu2").src = "right" + i + ".jpg";
}

---

通过将

i

声明为函数的一个参数，增量只会改变局部变量，而不会改变全局状态。同时，返回值也被忽略

var i = 1;

function start() {
    setInterval(changeEdu, 10000);
}

function changeEdu() {
//                ^^
    if (i == 4) {
        i = 1;
    } else {
        i++;
    }

    document.getElementById("edu1").src = "left" + i + ".jpg";
    document.getElementById("edu2").src = "right" + i + ".jpg";
}

---

我认为这是因为您在

start（）

函数开始时重新分配变量

I

setInterval

返回一个数字，该数字用于使用

clearInterval（数字）

函数取消函数

---

我对JS也很陌生，但我会尝试删除

start（）

函数中的重新分配，然后重试。

我相信这是因为在

start（）

函数开始时，您正在重新分配变量

I

setInterval

返回一个数字，该数字用于使用

clearInterval（数字）

函数取消函数

---

我对JS也很陌生，但我会尝试删除

start（）

函数中的重新分配，然后重试。

这不是

setInterval

的工作方式，它不会返回您的返回值。 您需要创建一个闭包

此外，从未调用startInterval（）。 将其更改为此，它将工作：

<script>
(function(){
    var i = 1;
    function changeEdu(){  
        if(i == 4){
            i = 1;
        }else{
            i++;
        }

//      document.getElementById("edu1").src = "left" + i + ".jpg";
//      document.getElementById("edu2").src = "right" + i + ".jpg";
console.log(i);
    }

    setInterval(changeEdu, 10000);
})();
</script>

（功能（）{
var i=1；
函数changeEdu（）{
如果（i==4）{
i=1；
}否则{
i++；
}
//document.getElementById（“edu1”）.src=“left”+i+”.jpg；
//document.getElementById（“edu2”）.src=“right”+i+”.jpg；
控制台日志（i）；
}
设置间隔（更改为10000）；
})();

这不是

setInterval

的工作方式，它不会返回您的返回值。 您需要创建一个闭包

此外，从未调用startInterval（）。 将其更改为此，它将工作：

<script>
(function(){
    var i = 1;
    function changeEdu(){  
        if(i == 4){
            i = 1;
        }else{
            i++;
        }

//      document.getElementById("edu1").src = "left" + i + ".jpg";
//      document.getElementById("edu2").src = "right" + i + ".jpg";
console.log(i);
    }

    setInterval(changeEdu, 10000);
})();
</script>

（功能（）{
var i=1；
函数changeEdu（）{
如果（i==4）{
i=1；
}否则{
i++；
}
//document.getElementById（“edu1”）.src=“left”+i+”.jpg；
//document.getElementById（“edu2”）.src=“right”+i+”.jpg；
控制台日志（i）；
}
设置间隔（更改为10000）；
})();

。您试图像计数器一样读取间隔ID。

i=setInterval

这不是您所认为的

setInterval

返回一个ID，因此当您调用

start（）

时，i立即被设置为间隔的ID，并且从那里开始递增。。您试图像计数器一样读取间隔ID。

i=setInterval

这不是您所认为的

setInterval

返回一个ID，因此当您调用

start（）

时，i会立即设置为间隔的ID，这不是很好，因为它用一个名为i的变量污染了全局范围。@Demonblack它也用名为

start

和

changeEdu

的变量污染了全局范围-这应该不是什么大问题。也许更具描述性的名称，如

currentEdu

，可能会更好，但变量范围不是这个问题的主题。人们当然可以用这个来避免问题。我和我有更多的问题，因为它太普遍了。我知道可变范围不是这里的主要问题，但这显然是一个新手，我们应该给他一些不是最坏的做法，特别是当它这么简单的时候。这不是很好，因为它用一个名为i的变量污染了全局范围。@Demonblack它也用名为

start

和

changeEdu

的变量污染了全局范围-这应该不是什么大问题。也许更具描述性的名称，如

currentEdu

，可能会更好，但变量范围不是这个问题的主题。人们当然可以用这个来避免问题。我和我有更多的问题，因为它太普遍了。我知道变量范围不是这里的主要问题，但这显然是一个新手，我们应该给他一些不是最糟糕的做法，特别是当它如此简单的时候。