替换YouTube IFRAME SRC断开自动播放

Question

我在模态打开时需要自动播放的YouTube视频iframe，因此，当打开模态时，我将Iframe的src设置为带有?autoplay=1的视频嵌入URL。对于第一个视频来说，这很好，任何其他视频均不自动播放。这些视频可以很好地加载，我可以玩。他们只是不尊重autoplay选项。

这是我用来替换IFRAME的src的代码：

$modalVideoPreviewIframe.attr('src', sessionPreviewVideoId && `https://www.youtube.com/embed/${sessionPreviewVideoId}?autoplay=1`);

我还尝试使用jQuery的clone和replaceWith在设置其src之前用新元素替换IFRAME：

const $modalVideoPreviewIframeClone = $modalVideoPreviewIframe.attr('src', 'about:blank').clone();
$modalVideoPreviewIframe.replaceWith($modalVideoPreviewIframeClone);
$modalVideoPreviewIframe = $modalVideoPreviewIframeClone;
$modalVideoPreviewIframe.attr('src', sessionPreviewVideoId && `https://www.youtube.com/embed/${sessionPreviewVideoId}?autoplay=1`);

Answer 1

我最终使用youtube iframe sdk：

$('#session-modal-video').replaceWith('<div id="session-modal-video"></div>');
const player = new YT.Player('session-modal-video', {
  height: '390',
  width: '640',
  videoId: sessionPreviewVideoId,
  events: {
    'onReady'() {
      if(autoplay) {
        player.playVideo();
      }
    },
    'onError'(error) {
      console.log('Failed to create Youtube video player', error)
    }
  }
});