YouTube 嵌入视频播放器的外部播放按钮

Question

<div id=player></div>
<div id=playvideo style= "width:40px; height:80px; background-color:#2b2b2b;" >
<script src="https://apis.google.com/js/platform.js"></script>
<script type="text/javascript">
      var tag = document.createElement('script');

      tag.src = "https://www.youtube.com/iframe_api";
      var firstScriptTag = document.getElementsByTagName('script')[0];
      firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);

      var player;
      function onYouTubeIframeAPIReady() {
        player = new YT.Player('player', {
          height: '448',
          width: '763',
          playerVars: {
              'showinfo': 0,
              'controls': 0,
        listType: 'playlist',
        list: 'PLD7SqVUGDdDBw_xmMKTDF5MlBwys_KlUk'
            },
          events: {
            'onReady': onPlayerReady,
            'onStateChange': onPlayerStateChange
          }
        });
      }

      function onPlayerReady(event) {
        // event.target.playVideo();
      }

      function onPlayerStateChange(event) {
        if (event.data == YT.PlayerState.ENDED) {
          player.stopVideo();
        }
      }
    </script>

我有一个这样的嵌入代码，我希望名为“playvideo”的 div 像 YouTube 的播放按钮一样，我认为这很简单，但我是 JavaScript 新手，谁能有想法？

Answer 1

您可以使用 YouTube 的 Player API 功能： player.playVideo()

所以... HTML：

<div id="mydiv" onclick="play_this_video()">Play my video</div>

和 JavaScript：

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