嵌入音频

Question

我创建了一个番茄钟（定时器）。我希望在每次比赛或休息结束后播放声音。

function countDownTimer() {

  timer = setInterval(function() {

    if (!pause) {

      if (sec == 0) {

        if (minutes !== 0)
          minutes--;

        if (minutes == 0 && hours !== 0) {

          display(hours, minutes, sec);
          hours--;
          minutes = 59;

        }

        display(hours, minutes, sec = 59);

      } else {

        sec--;
        display(hours, minutes, sec);

      }
    }

  }, 1000);

}


function display(hr, min, sec) {

  checkIfOver(hr,min,sec);
  if (hr < 10)
    hr = "0" + hr;
  if (min < 10)
    min = "0" + min;
  if (sec < 10)
    sec = "0" + sec;

  document.getElementById("clock").innerHTML = hr + ":" + min + ":" + sec;

}    

function checkIfOver(hr,min,sec){

    if ((hr == 0 && min == 0 & sec == 0) && session == true) {

    session = false;
    breaks = true;
    if (confirm("Session is over. Start Break??")) 
      setTime();
    else {
      clearInterval(timer);
      document.getElementById("start").disabled = false;
    }
  } else if ((hr == 0 && min == 0 & sec == 0) && breaks == true) {

    session = true;
    breaks = false;
    if (confirm("Break is over. Start Session??")) 
      setTime();
    else {
      clearInterval(timer);
      document.getElementById("start").disabled = false;
    }
  }
}

我尝试通过html嵌入音频src并通过js播放。我也试过使用音频对象。还有其他办法吗？

完整代码：http://codepen.io/jpninanjohn/pen/WwBWpO?editors=1010

Answer 1

转换为mp3格式并使用HTML5音频元素：

<audio src="success.mp3">
  Your browser does not support the audio element.
</audio>

另一个解决方案是直接创建Audio对象而不使用任何html元素：

var audio = new Audio('success.mp3');
audio.play();