在Safari上搜索“已结束”的中间视频的HTML5视频

Question

我正在使用<video>作为背景英雄视频。它从0:00开始。当它到达0:11剪辑的末尾时，它会弹回：02并从那里重复。我用它完成了它：

document.getElementById('bgvid').addEventListener('ended',repeatVid,false);
function repeatVid(e) {
  var mediaElement = document.getElementById('bgvid');
  mediaElement.currentTime = 2;
  mediaElement.play();
}

我只关心桌面体验，因为它会转换为平板电脑/手机上的后备图片。这适用于Chrome，Firefox甚至IE。然而，Safari从0:00而不是02重复。

将整个功能放在按钮上，而不是addeventListener。重新分配currentTime似乎不是问题。我试过将整件事放在video.oncanplaythrough = function () {里面。我尝试将.addEventListener('ended')更改为$('video').on('ended',function(){或video.onended = function () {。

似乎.play（）总是会把你送回到0:00，除了我可以让它工作on('click')，所以有一些东西。谢谢你的帮助！

Answer 1

Safari中的play()函数似乎将currentTime重置为零。

如果您play()视频并在此之后直接设置了currentTime，它就会像预期的那样工作：

document.getElementById('bgvid').addEventListener('ended',repeatVid,false);
function repeatVid(e) {
  var mediaElement = document.getElementById('bgvid');
  mediaElement.play();
  mediaElement.currentTime = 2;
}