Javascript canvas.style.display="；块；不起作用

我无法解释为什么下面的“buttonHandler”函数中的第一行不起作用，该语句后面不显示画布。然而，“startPlay”函数的第一行是相同的，这显示了画布！如果有人能从这段代码中看出原因，请让我知道

谢谢

我曾在Chrome和Firefox中尝试过这一点，但效果相同

function buttonHandler(){
    canvas.style.display = "block";
    var menuDisplay = document.getElementById("menuDisplay");
    menuDisplay.style.display = "none";

    drawingSurface.font = readyDisplay.font;
    drawingSurface.fillStyle = readyDisplay.fillStyle;
    drawingSurface.textBaseline = readyDisplay.textBaseline;
    drawingSurface.fillText(readyDisplay.text, readyDisplay.x, readyDisplay.y);
    window.setTimeout("startPlay()", 3000);
}

function startPlay(){
    canvas.style.display = "block";
    gameOver.style.display = "none";
    balls=[];
    for(var i=0;i < sprites.length; i++){
        var thisSprite = sprites[i];
        if(thisSprite !== cup){
            removeObject(thisSprite, sprites);
        }
    }
    score = 0;
    totalSeconds = 5;
    gameState = PLAYING;
    drawingSurface.clearRect(0, 0, canvas.width, canvas.height);
    window.setTimeout("tick()", 1000); // Start the countdown timer
    timeToBall = Math.floor(Math.random() * 250) + 50;
    update();
}

函数按钮Handler（）{
canvas.style.display=“块”；
var menuDisplay=document.getElementById（“menuDisplay”）；
menuDisplay.style.display=“无”；
drawingSurface.font=readyDisplay.font；
drawingSurface.fillStyle=readyDisplay.fillStyle；
drawingSurface.textBaseline=readyDisplay.textBaseline；
drawingSurface.fillText（readyDisplay.text、readyDisplay.x、readyDisplay.y）；
setTimeout（“startPlay（）”，3000）；
}
函数startPlay（）{
canvas.style.display=“块”；
gameOver.style.display=“无”；
球=[]；
对于（变量i=0；i

您可能正在

窗口中运行代码。页面中的onload

事件

当您使用string函数调用这样的

setTimeout

时：

window.setTimeout("startPlay()", 3000); // just a string reference

startPlay（）

将在全局

窗口

对象上求值，这意味着在求值时作用域将无法访问

startPlay（）

，因为该函数是

onload

调用函数的子函数，因此无法从

窗口

作用域访问

（除了查看代码外，不会发生任何事情）

通过将

setTimeout（）

更改为使用函数引用，这将在引用时函数可用时起作用（子作用域可以访问父作用域的内部工作，但vica不能访问父作用域的内部工作）

此处，函数引用本身将被传输到超时事件回调，而不是字符串引用：

window.setTimeout(startPlay, 3000); // now we have an actual function reference

这也适用于另一个实例（这也更安全）

（几乎相同的代码，只是一个直接的函数引用。）

---

希望这有帮助

需要完整的代码才能看到。JSFIDLE是为我们准备的。千万不要用字符串来使用

setTimeout

/

setInterval

，因为这样他们就会使用邪恶的

eval

！使用对函数的引用（

setTimeout（tick，1e3）

）如何知道画布未显示？我知道画布未显示，因为当菜单udisplay.style.display=“none”；行仅运行主体背景显示3秒钟，然后画布在startPlay函数运行时返回。如果没有更多信息，我们将无法帮助您。请张贴一个独立的例子。看看这意味着什么。