如何延迟警报并重新加载，以便音频文件可以在javascript中播放？

Question

我正在制作一款小游戏，以便更好地尝试和学习javascript。到目前为止，我认为它非常好。当怪物射击并且射击击中玩家时会发出声音。然而，当玩家输掉比赛或赢得比赛时，我无法发挥声音。我检查以确保音频文件不是自己播放的问题。以下是输赢功能：

function gameReset(){ //If the player has lost
            if(lives < 0){
                 gameOverSound = new Audio("gameOver.wav"); 
                 gameOverSound.play();
                 alert("You lost. Click 'Ok' to restart the game");
                 location.reload();  
            }
        }

    function winCondition(){ //If the player has won
            if(monsterHP < 0){
                 monsterDeathSound = new Audio("explosion.mp3"); //Assigns the monster's death sound
                 monsterDeathSound.play();
                 alert("Congratulations you beat the monster! Hit 'OK' to restart the game.");
                 location.reload();
                }
            }

我已经尝试过使用setTimeout（，）并将警报和重新加载到一个单独的函数中，然后调用它，但它没有工作，尽管我可能做错了。我需要一个小延迟，大概3秒钟。提前致谢。      编辑：我已经实现了.onended。我有一个更新游戏的setInterval。当2条件功能（赢/输）时，该功能在停止前多次运行。如果我在更新功能中对其进行评论，那么胜负功能根本不会运行。所以我需要这样做才能使这两个函数只运行一次。我已经尝试创建一个变量并将其设置为false然后在函数设置中为true，因此它不能再次运行但是没有用。

function winCondition(){ //If the player has won
            if(monsterHP < 0){
                 monsterDeathSound = new Audio("explosion.mp3"); //Assigns the monster's death sound
                console.log("d");
                 monsterDeathSound.play();
                monsterDeathSound.onended = function() {
      alert("Congratulations you beat the monster! Hit 'OK' to restart the game.");
      location.reload();
                }
                //alert("Congratulations you beat the monster! Hit 'OK' to restart the game.");
                 //location.reload();
                }
            }

    function update(){
        drawEverything();
        collision();
        movement();
        //gameReset();
        playerAttack();
        //winCondition();
    }
    setInterval(update,1000/framesPerSecond)

Answer 1

如果您想在播放声音和提醒之间添加延迟，可以通过以下两种方式进行：

  

请注意.play()声音是异步的：即使音频还没有开始播放，代码也会立即继续执行，这就是为什么你需要等待声音的原因结束（在我看来推荐），或使用setTimeout

onended音频事件

＆＃13;

＆＃13;

var lives = -1;
var monsterHP = -1;

function gameReset() { //If the player has lost
  if (lives < 0) {
    gameOverSound = new Audio('https://soundbible.com/grab.php?id=2167&type=mp3');
    gameOverSound.play();
    gameOverSound.onended = function() {
      alert("You lost. Click 'Ok' to restart the game");
      location.reload();
    }
  }
}

function winCondition() { //If the player has won
  if (monsterHP < 0) {
    monsterDeathSound = new Audio('https://soundbible.com/grab.php?id=2182&type=mp3'); //Assigns the monster's death sound
    monsterDeathSound.play();
    monsterDeathSound.onended = function() {
      alert("Congratulations you beat the monster! Hit 'OK' to restart the game.");
      location.reload();
    }
  }
}

＆＃13;

<button onclick="gameReset()">reset</button>
<button onclick="winCondition()">win</button>

＆＃13;

＆＃13;

＆＃13;

setTimeout功能

＆＃13;

＆＃13;

var lives = -1;
var monsterHP = -1;

function gameReset() { //If the player has lost
  if (lives < 0) {
    gameOverSound = new Audio('https://soundbible.com/grab.php?id=2167&type=mp3');
    gameOverSound.play();
    setTimeout(function() {
      alert("You lost. Click 'Ok' to restart the game");
      location.reload();
    }, 3000);
  }
}

function winCondition() { //If the player has won
  if (monsterHP < 0) {
    monsterDeathSound = new Audio('https://soundbible.com/grab.php?id=2182&type=mp3'); //Assigns the monster's death sound
    monsterDeathSound.play();
    setTimeout(function() {
      alert("Congratulations you beat the monster! Hit 'OK' to restart the game.");
      location.reload();
    }, 3000);
  }
}

＆＃13;

<button onclick="gameReset()">reset</button>
<button onclick="winCondition()">win</button>

＆＃13;

＆＃13;

＆＃13;

Answer 2

如果浏览器尝试加载文件，您是否尝试使用浏览器开发人员工具？

你试过这个吗？ setTimeout(function(){ alert("You lost. Click 'Ok' to restart the game"); location.reload();},500）;