循环延迟

时间:2016-12-21 12:47:15

标签: javascript jquery

我想遍历一个数组并在每次迭代时指定一个颜色。设置颜色后,我想延迟到下一次迭代,然后再次更改颜色。

这是我目前拥有的代码但是我无法在for-loop的每次迭代之间创建 just1 数组之间的延迟。

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();

1 个答案:

答案 0 :(得分:0)

我想你想要做的是遍历数组,并且每个元素之间都有延迟。您需要摆脱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);

我不确定the delay between the text specific to the array data present in just1你的意思。据我所知,你已经指定了一个固定的延迟(1000)。你的意思是你想根据数组中的值来获得不同的延迟吗?如果是这样,您可以更改循环中的值:

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

这会将延迟设置为

循环遍历数组时

2.8,5.45,2.41和11.31