如何让这个Javascript函数正确地迭代?

如何让这个Javascript函数正确地迭代?,javascript,html,function,background,Javascript,Html,Function,Background,我正在将一个科纳米复活节彩蛋加入我的网站,以获得更多乐趣;输入Konami代码,它会播放街头斗士的hadouken声音,背景光中歌舞伎面具上的眼睛会亮一秒钟 它起作用了…有点。我有个问题。输入Konami代码后,每次用户按键时,上述效果都会迭代。这不是故意的。我只希望每次用户输入完整代码时,效果立即消失一次 还有一个小得多的小问题需要解决。面具的眼睛实际上是通过短暂地将初始背景切换为具有所需效果的背景而发光的。然而,第一次这样做时,页面在加载第二个背景时闪烁,但在后续迭代中没有闪烁。我曾想过将第

我正在将一个科纳米复活节彩蛋加入我的网站,以获得更多乐趣;输入Konami代码,它会播放街头斗士的hadouken声音,背景光中歌舞伎面具上的眼睛会亮一秒钟

它起作用了…有点。我有个问题。输入Konami代码后,每次用户按键时,上述效果都会迭代。这不是故意的。我只希望每次用户输入完整代码时,效果立即消失一次

还有一个小得多的小问题需要解决。面具的眼睛实际上是通过短暂地将初始背景切换为具有所需效果的背景而发光的。然而,第一次这样做时,页面在加载第二个背景时闪烁,但在后续迭代中没有闪烁。我曾想过将第二个背景作为HTML图像加载,并将其可见性设置为hidden,但这不起作用

    <script>
        function PlaySound(path)
        {
            var audioElement = document.createElement('audio');
            audioElement.setAttribute('src', path);
            audioElement.play();
        }
        function resetBackground()
        {
            document.body.style.backgroundImage = "url('onics.png')";
        }
        function flashBackground()
        {
            document.body.style.backgroundImage = "url('onics_red.png')";
            setTimeout(resetBackground, 830);
        }
        if(window.addEventListener)
        {
            var kkeys=[],konami="38,38,40,40,37,39,37,39,66,65";
            window.addEventListener("keydown",function(e)
            {
            kkeys.push(e.keyCode);
            if(kkeys.toString().indexOf(konami)>=0)
                {
                    PlaySound('hadouken.wav');
                    flashBackground();
                }
            },true);
        }
    </script>

功能播放声音(路径)
{
var audioElement=document.createElement('audio');
setAttribute('src',path);
audioElement.play();
}
函数resetBackground()
{
document.body.style.backgroundImage=“url('onics.png')”;
}
函数flashBackground()
{
document.body.style.backgroundImage=“url('onics_red.png')”;
setTimeout(resetBackground,830);
}
if(window.addEventListener)
{
var kkeys=[],konami=“38,38,40,40,37,39,37,39,66,65”;
window.addEventListener(“向下键”,函数(e)
{
kkeys.push(即按键代码);
if(kkeys.toString().indexOf(konami)>=0)
{
播放声音(“hadouken.wav”);
flashBackground();
}
},对);
}
您可以添加一个标志

<script>
    var konamiPlayed = false;
    function PlaySound(path)
    {
        var audioElement = document.createElement('audio');
        audioElement.setAttribute('src', path);
        audioElement.play();
    }
    function resetBackground()
    {
        document.body.style.backgroundImage = "url('onics.png')";
        konamiPlayed = false;
    }
    function flashBackground()
    {
        document.body.style.backgroundImage = "url('onics_red.png')";
        setTimeout(resetBackground, 830);
    }
    if(window.addEventListener)
    {
        var kkeys=[],konami="38,38,40,40,37,39,37,39,66,65";
        window.addEventListener("keydown",function(e)
        {
            if (!konamiPlayed) {
                kkeys.push(e.keyCode);
                if(kkeys.toString().indexOf(konami)>=0)
                {
                    konamiPlayed = true;
                    PlaySound('hadouken.wav');
                    flashBackground();
                }
            }
        },true);
    }
</script>

var konamiPlayed=假;
功能播放声音(路径)
{
var audioElement=document.createElement('audio');
setAttribute('src',path);
audioElement.play();
}
函数resetBackground()
{
document.body.style.backgroundImage=“url('onics.png')”;
科纳米拉=假;
}
函数flashBackground()
{
document.body.style.backgroundImage=“url('onics_red.png')”;
setTimeout(resetBackground,830);
}
if(window.addEventListener)
{
var kkeys=[],konami=“38,38,40,40,37,39,37,39,66,65”;
window.addEventListener(“向下键”,函数(e)
{
如果(!Konamiplay){
kkeys.push(即按键代码);
if(kkeys.toString().indexOf(konami)>=0)
{
科纳米拉=真;
播放声音(“hadouken.wav”);
flashBackground();
}
}
},对);
}
编辑:


至于一个小问题,我认为这是因为浏览器只有在您要求时才会加载图像。因此,第一次需要一些时间。

您需要重置
kkeys
数组:

    if(window.addEventListener)
    {
        var kkeys=[],konami="38,38,40,40,37,39,37,39,66,65";
        window.addEventListener("keydown",function(e)
        {
        kkeys.push(e.keyCode);
        if(kkeys.toString().indexOf(konami)>=0)
            {
                kkeys = [];
                PlaySound('hadouken.wav');
                flashBackground();
            }
        },true);
    }

我很感激,格温达尔。不过,这带来了一个不同的问题。当我使用这个脚本时,它只会播放一次,句号。我希望每次输入代码时播放一次。因此,虽然我的原始代码在输入代码时播放它,并且每次击键之后(不好),但无论输入代码多少次,此代码只播放一次。@AdamFeoras my bad,我没有正确理解您的问题。jcubic给出了一个更好的答案。我仍然很感激你在周五早上抽出时间来帮助我。就这样。谢谢,jcubic。