停止播放然后再次播放视频后，会播放视频的音频，但视频会冻结

Question

这是我的仅使用JavaScript播放和暂停视频文件的代码。当我们执行playMe()时，它只播放从第二个9到14的视频，并将这段视频重复两次（因为我们在myDuration(9, 14, 2);中有playMe()）。

除了一个令人烦恼的问题，如果没有您的帮助我找不到解决方案：

如果执行playMe()，则视频将从给定的持续时间开始播放（好！），如果执行stopMe()，则视频会暂停并隐藏（好！），到目前为止，效果很好！但是在这一点上，如果再次执行playMe()，音频会播放，但是视频会冻结，如果再次执行stopMe()，它将不再起作用！

令人困惑的部分是playMe()和stopMe()的首次执行工作正常，而其他执行则不...（我只希望这段代码与chrome一起使用）

我希望能够不受任何限制地播放和停止该视频。

我缺少什么？该如何解决？

代码如下：

// Function to play the video
function playMe() {

  function addSourceToVideo(element, src, type) {

    var source = document.createElement('source');
    source.src = src;
    source.type = type;
    element.appendChild(source);

  }

  var video = document.createElement('video');
  video.setAttribute("id", "video-style");

  document.body.appendChild(video);

  addSourceToVideo(video, 'https://round-arm-authority.000webhostapp.com/Ultimate%20Video%20Hack/videos/vid1.mp4', 'video/mp4');

  var allVideos = document.getElementsByTagName('video');
  var rep = 0;

  myDuration(9, 14, 2); // Play video from 9 to 14 seconds twice: (startTime, endTime, repeats)

  function myDuration(a, b, r) {

    allVideos[0].currentTime = a;
    fadeInFunction();

    var newVar = setInterval(myTimere, 10);

    function myTimere() {
          
      if (allVideos[0].currentTime >= b) {
        clearInterval(newVar);
        fadeOutFunction();
        console.log("fadeOutFunction " + allVideos[0].currentTime)
      }
    }

    function fadeOutFunction() {
      volumeValue = allVideos[0].volume;

      var myVar = setInterval(myTimer, 10);

      function myTimer() {

        allVideos[0].volume = Math.max(volumeValue -= 0.01, 0)

        if (allVideos[0].volume == 0) {

          clearInterval(myVar);
          allVideos[0].pause();
          var blah = allVideos[0].currentTime;
          console.log("paused here: " + blah);

          rep++
          if (rep < r) {
            myDuration(a, b, r);

          }

        }
      }
    }

    function fadeInFunction() {
      var value = 0.01;
      allVideos[0].volume = 0;
      volumeValue = 0;
      allVideos[0].style.visibility = "visible";
      allVideos[0].play();

      var myVar = setInterval(myTimer, 10);

      function myTimer() {
        allVideos[0].volume = Math.min(volumeValue += 0.01, 1)
        if (allVideos[0].volume == 1) {
          clearInterval(myVar);
        }
      }
    }
  }

};



// Function to stop the video
function stopMe(){
  var videoElement = document.getElementById("video-style");
  videoElement.style.visibility = "hidden";
  videoElement.pause();
};