javascript - 如何在点击时播放声音？

Question

我用 javascript 制作的应用程序有问题。当我点击某物时，我想要播放声音。如果我再次单击它，我希望声音再次开始。

我的问题是因为声音播放的时间比我点击两次的时间长，每次点击都不会启动声音。

用我的应用程序创建一个 JSFiddle 需要很长时间，所以我想知道是否有人可以使用这个 JSFiddle 解决这个问题:http://jsfiddle.net/jamiehap/jtCA9/12/

基本上我希望能够继续点击播放按钮并且声音会重新开始:)

下面是我在 fiddle 中使用的代码:)

     $(document).ready(function () {
          var audioElement = document.createElement('audio');
          audioElement.setAttribute('src', 'http://static1.grsites.com/archive/sounds/quotes/quotes006.mp3');
          audioElement.setAttribute('autoplay:false', 'autoplay');
          //audioElement.load code above. if you take out :false from the code the file will auto play than everythin works the same after that()
          $.get();
          audioElement.addEventListener("load", function () {
              audioElement.play();
          }, true);


          $(document).keypress(function (e) {
              if (e.which == 13) { //press enter the audio will play
                  audioElement.play();

              } else if (e.which == 32) { //press spacebar the audio will                             pause play
                  audioElement.pause();
              }
          });

// the code below wil allow you to click the play and stop button with the mouse
          $('.play-button').click(function () { 
              audioElement.play();
          });


          $('.pause').click(function () {
              audioElement.pause();
          });
      });

Answer 1

在调用播放之前将当前时间设置为零

$('.play-button').click(function () {
    audioElement.pause();
    audioElement.currentTime = 0;
    audioElement.play();
});