'；多线程'；setInterval函数（Javascript）

我的任务是创建一个进度条（实际上，一个看起来像进度条的计时器），它将在点击事件时触发。我需要多个条，因为一个人可能会点击多个元素，从而触发进度条。这是我现在的脚本：

function createPbar(IDofpBar, timeOut, timeIncrement ) {

            ...grab dom elements and do the math...

    i=0;
    var newWidth = 0;   

    var x = setInterval(function(){
        theBar.style.width = newWidth+"px"
        newWidth = newWidth + bIncrement;
        if (i == counter) {
            clearInterval(x);
        }
        i++
    }, timeIncrement*1000);

}

这很好，直到我一次有多个页面。当我触发第二个时，它会影响第一个。我猜这是因为每次我触发一个新的进度条时都会重新分配变量

---

有没有办法隔离每次调用的变量

使用

var

来声明当前函数范围内的变量，而不是全局范围内的变量。在

i=0之前缺少
var
语句。我没有看到初始化工具栏的代码，但是您可能也缺少一个
var

function createPbar(IDofpBar, timeOut, timeIncrement ) {

    /* ...grab dom elements and do the math... */

    var theBar = ...,
        i=0,
        newWidth = 0;

    var x = setInterval(function(){
        theBar.style.width = newWidth+"px"
        newWidth = newWidth + bIncrement;
        if (i == counter) {
            clearInterval(x);
        }
        i++
    }, timeIncrement*1000);
}

以防万一：.
使用
var
在当前函数的范围内而不是在全局范围内声明变量。在
i=0之前缺少
var
语句。我没有看到初始化工具栏的代码，但是您可能也缺少一个
var

function createPbar(IDofpBar, timeOut, timeIncrement ) {

    /* ...grab dom elements and do the math... */

    var theBar = ...,
        i=0,
        newWidth = 0;

    var x = setInterval(function(){
        theBar.style.width = newWidth+"px"
        newWidth = newWidth + bIncrement;
        if (i == counter) {
            clearInterval(x);
        }
        i++
    }, timeIncrement*1000);
}

以防万一：。
马特的答案是正确的，但我将进一步详述

在javascript中，不使用
var
关键字分配变量会在全局范围内创建变量。在当前代码中，这意味着进度条的所有实例都将引用和访问同一个
i
实例

通过使用
var
关键字在函数内部声明变量，它将变量声明为具有局部作用域，并使其只能从函数内部访问。这允许您拥有函数中使用的变量的独立版本

这是一个难题，我经常发现自己在忘记的时候不得不回去解决。
马特的答案是正确的，但我将进一步阐述

在javascript中，不使用
var
关键字分配变量会在全局范围内创建变量。在当前代码中，这意味着进度条的所有实例都将引用和访问同一个
i
实例

通过使用
var
关键字在函数内部声明变量，它将变量声明为具有局部作用域，并使其只能从函数内部访问。这允许您拥有函数中使用的变量的独立版本

这是一个我经常发现自己不得不回去解决的问题，当我忘记的时候。
argh！是的。那就是罪魁祸首。啊！是的。那就是罪魁祸首，我很感激你的解释！但这并不正确。未声明的变量在赋值时被创建为全局对象的属性，在此之前尝试使用它们将创建一个引用错误，如“i未定义”。声明变量意味着它们在代码执行开始之前就可以使用，从而防止此类错误。我感谢您的解释！但这并不正确。未声明的变量在赋值时被创建为全局对象的属性，在此之前尝试使用它们将创建一个引用错误，如“i未定义”。声明变量意味着它们在代码执行开始之前可用，从而防止此类错误。