Javascript HTML音频在只调用一次时重复播放函数

我有下面的函数,它是一个更大函数的一部分,但是我去掉了所有不属于问题的部分。

createMediaElementSource 它需要HTML元素。

在 ended replay 按钮,那个 play

我试着把代码放在一个片段里,但是我不能复制这个问题,所以我只好把它放到小提琴里。- https://jsfiddle.net/6n2f34eh/

在整个功能上,有用户交互激活播放。

<button type="button" class="btn-replay">REPLAY</button>

var func = function() {
  that = this;
  that.sound;

  this.init = function() {
    document.querySelector(".btn-replay").addEventListener("click", that.play);
    tag = document.createElement("audio");
    tag.className = "player";
    document.body.appendChild(tag);
    that.sound = document.querySelector(".player");
    that.sound.src = 'https://www2.cs.uic.edu/~i101/SoundFiles/CantinaBand3.wav';
    that.sound.addEventListener("canplaythrough", this.play);
    that.sound.addEventListener("ended", this.ended);
  }

  this.ended = function() {
    console.log("ended")
  }

  this.play = function() {
    console.log("play")
    that.sound.play();
  }

  this.init();

}

test = new func();