Javascript 如何在不同时间隐藏/显示多个正方形

我仍然在为我的简单javascript游戏而挣扎。这是我先前的问题：

一些方块随机显示和隐藏几秒钟，你必须点击它们。我使用RaphaelJS绘制正方形和一些JQuery（$.each（）函数）

我无法使用setInterval对每个方块进行隐藏/显示。Mishelle制作的函数看起来不错，但我得到一个“这不是函数”错误。。我测试过不同的东西，但不像我想的那么明显：/

window.onload = function() {  

    var paper = new Raphael(document.getElementById('canvas_container'), 500, 500);
    // random function to for the x and y axis of the square
    function random(min, max) {
      return Math.floor(Math.random() * (max - min + 1)) + min;  
    }
    var rectanglemain = paper.rect(0, 0, 500, 500).attr({fill: "white",});
    var win_click = 0; // set the var to count the click on the square
    var recs = [];
    for(var i = 0; i < 50; i++) {
        var x = random(1,450);
        var y = random(1,450);
        var rec = paper.rect(x, y, 50, 50).attr({fill: 'blue'});
        recs.push(rec); // add the square in an array
        recs[i].click(function () {
        //counting the clicks
        win_click = win_click + 1;
        })
        function hideSquare() {recs[i].hide();}
        hideSquare();
    }   
    rectanglemain.click(function () {
        alert('you click on ' + win_click + ' squares');
    }); 
     /* here is a function made by Mishelle on my previous question, unfortunately I can't make it work (this is not a function error).
function showBriefly (timeFromNow, duration) {
        window.setTimeout(this.rec.show, timeFromNow);
        window.setTimeout(this.rec.hide, timeFromNow + duration);
        }
     recs[2].showBriefly(1000, 3000); to test the function
*/
}

window.onload=function（）{
var paper=new Raphael（document.getElementById（'canvas_container'），500500）；
//用于正方形x轴和y轴的随机函数
随机函数（最小值、最大值）{
返回Math.floor（Math.random（）*（max-min+1））+min；
}
var rectanglemain=paper.rect（0,0500500）.attr（{fill:“white”，}）；
var win_click=0；//设置var以计算在正方形上的单击次数
var recs=[]；
对于（变量i=0；i<50；i++）{
var x=随机（1450）；
var y=随机（1450）；
var rec=paper.rect（x，y，50，50）.attr（{fill:'blue'}）；
rec.push（rec）；//在数组中添加正方形
记录[i]。单击（函数（）{
//计算点击次数
赢点击=赢点击+1；
})
函数hideSquare（）{recs[i].hide（）；}
hideSquare（）；
}   
rectanglemain。单击（函数（）{
警报（“你点击“+win_点击+”方块”）；
}); 
/*这是Mishelle在我前面的问题上做的一个函数，不幸的是我不能让它工作（这不是一个函数错误）。
功能简要显示（时间、持续时间）{
setTimeout（this.rec.show，timeFromNow）；
setTimeout（this.rec.hide，timeFromNow+duration）；
}
recs[2]。showShortly（10003000）；用于测试函数
*/
}

谢谢你的帮助：）

试试看

window.setTimeout(function(){this.rec.show();}, timeFromNow )

---

刚刚遇到你的问题，以防万一你读到这篇文章，你想知道问题出在哪里

这个

在回调中是未定义的，因此您需要存储在变量中引用的矩形（我称它为

正方形

），请参见我的代码：

showBriefly: function(timeFromNow, duration) {
    square = this.box;
    setTimeout(function(){square.show();}, timeFromNow )
    setTimeout(function(){square.hide();}, timeFromNow + duration )
}

干杯

谢谢，我不得不删除“这个”。它只显示（第一个？）正方形。我尝试使用recs[I]，但它无法识别它，但是recs[2]可以工作。如果您在settimeout之前添加单词“debugger；”（不带引号），并在firefox中打开firebug扩展运行代码，您将在给定时间看到它指的是什么感谢这些技巧，这指的是“未定义”：/但是看起来我离解决方案越来越近了。