Javascript YouTube嵌入式视频在动态更新iframe src时停止播放

我正在使用iframe标签在我的网页上加载一些视频

<iframe id="player" type="text/html" width="640" height="280" src="https://www.youtube.com/embed/M7lc1UVf-VE?enablejsapi=1" frameborder="0">
</iframe>

上面的代码运行良好。但是，如果我取消注释动态更新iframe的src属性的注释部分，src将被更新，视频也将排队，但它不会播放

另外，当我在没有伪src属性的情况下尝试上面的代码（在取消注释注释注释部分之后），它会抛出如下错误消息-

未捕获的TypeError:对象#没有方法“loadVideoById”

我猜这可能是因为它无法识别enablejsapi设置为true

更新iframe的src属性并使代码在不向iframe标记提供伪src的情况下工作的最佳方法是什么

---

提前谢谢

这是预期的行为；如果在API之外更改iframe src，则会破坏API创建的绑定。解决这个问题的最佳方法是根本不创建iframe，而是让API为您创建（您只需创建空标记，然后为每个div创建一个YT.Player对象……DOM节点将为您注入，已经绑定到iframe API。有关如何将空的ID传递给构造函数的示例，请参阅），然后始终使用loadVideoById更改视频

话虽如此，如果您更愿意手动创建iFrame，但是如果您得到的代码（jquery被注释掉）能够正常工作，那么您可以使用它。。。有没有令人信服的理由让jquery手动更改src属性（当cueVideoById已经以编程方式进行更改时）

function playOnClick() {
  player.playVideo();                                                                                                                                                                            
}

function loadOnClick(videoId, videoURL) {

  // videoURL contains the url of video in the following format - https://www.youtube.com/watch?v=videoID

  /*
  videoURL = videoURL.replace(/watch\?v\=/, 'embed/');                                                                                                                                                     
  videoURL += '?enablejsapi=1';                                                                                                                                                                            
  jQuery('#player').attr('src', videoURL);                                                                                                                                                                 
  */

  player.cueVideoById(videoId);
}