Question

我想编写一个简单的函数，它在模式中使用新文本每秒更新一个段落元素<p></p>，但是我不确定如何延迟方法调用这是我尝试的解决方案但是它似乎不起作用。如果你删除了setTimeout方法并用一个简单的递归调用替换它，那么该函数会按照预期的方式打印出模式，但不会按照我想要的延迟打印出来。

function printPattern(eventSource, width, height, counter){
    if(height == 1 && counter >= width) {
        return;
    }
    else{
        if(counter >= width){
            eventSource.innerHTML += "<br>";
            //printPattern(eventSource,width,height-1,0);
            setTimeout(printPattern(eventSource,width,height-1,0), 1000)
        }
        else{
            if((counter%2 == 0) ^ (height%2 == 1)){
                eventSource.innerHTML += "O";
            }
            else{
                eventSource.innerHTML += "X";
            }
            //printPattern(eventSource,width,height,counter+1);
            setTimeout(printPattern(eventSource,width,height,counter+1), 1000)
        }
    }
}

function displayPattern(source){
    printPattern(source, 4, 4, 0);
}

Answer 1

您将调用printPattern的结果传递给setTimeout，而不是传递函数本身。你想要：

setTimeout(function() {
  printPattern(eventSource, width, height, counter+1);
}, 1000);

JavaScript递归延迟方法调用

1 个答案: