javascript - for循环延迟

Question

我想循环一个数组并在每次迭代时分配一个颜色。设置颜色后，我想延迟到下一次迭代后再再次更改颜色。

这是我当前拥有的代码，但我无法在 just1 数组上的 for 循环的每次迭代之间创建延迟。

var colors = new Array("Good","Warning","Bad");
var crntcolor= 0;
just1=[[2.8077203491999057, -1.0756484331027858], [5.4610502752805568, -1.1574541704299315], [2.414925300315495, -1.506728995633369], [11.3143165555403673, -1.4461945021353346]];
function ChangeText()
{
    document.getElementById('changeText').innerHTML = colors[crntcolor];          
    for(i=0; i<just1.length; i++)
    {
    if(just1[i][0] >= -5 && just1[i][0] <= 5)
    {        
        crntcolor =0;
    }
    else if (just1[i][0] > 5 && just1[i][0] <= 10)
    {
        crntcolor = 1;
    }
    else if (just1[i][0] > 10)
    {
        crntcolor = 2;
    }
    setTimeout("ChangeText();",1000);
}
}

ChangeText();

Answer 1

我想你想要做的是循环数组并且每个元素之间有一个延迟。您需要摆脱 for 循环并一次仅更改一个元素的文本:

var colors = new Array("Good","Warning","Bad");
var crntcolor= 0;
var just1 = [[2.8077203491999057, -1.0756484331027858], [5.4610502752805568, -1.1574541704299315], [2.414925300315495, -1.506728995633369], [11.3143165555403673, -1.4461945021353346]];
function ChangeText(index)
{
    document.getElementById('changeText').innerHTML = colors[crntcolor];          

    if(just1[index][0] >= -5 && just1[index][0] <= 5)
    {        
        crntcolor =0;
    }
    else if (just1[index][0] > 5 && just1[index][0] <= 10)
    {
        crntcolor = 1;
    }
    else if (just1[index][0] > 10)
    {
        crntcolor = 2;
    }
    if(index < just1.length)
    {
        setTimeout(function() { ChangeText(index+1); },1000);
    }

}

ChangeText(0);

我不确定just1中存在的数组数据特定的文本之间的延迟是什么意思。据我所知，您指定了固定延迟(1000)。您的意思是您想要根据数组中的值有不同的延迟吗？如果是这样，您可以更改循环中的值:

setTimeout(function() { ChangeText(index+1); },1000 * just1[index][0]);

这会将延迟设置为

循环数组时分别为 2.8、5.45、2.41 和 11.31