如何在嵌入式 YouTube iFrame 端触发功能

问题描述

尝试在嵌入式 YouTube iFrame 的末尾触发函数.只需要知道如何找到终点——在那之后我就很好了.

Trying to fire a function at the end of an embedded YouTube iFrame's end. Just need to know how to find the end - after that I am good.

推荐答案

这是我想出的在 IFrame 上使用的答案... jQuery 函数是我为我的项目编写的 - 你可以把它换掉为你所需要的.注意:您的 YouTube 视频必须在网址中添加enablejsapi=1".

Here is the answer I came up with to use on an IFrame... The jQuery function is one that I wrote for my project - you can switch it out for what you need. To note: your YouTube video has to have "enablejsapi=1" added to the url.

<div class="video-holderYT">
        <iframe width="480" id="ytplayer" height="270" class="videoImageYT" src="http://www.youtube.com/embed/YourVideoIDHere?rel=0&amp;autoplay=0&amp;modestbranding=1&amp;showinfo=0&amp;autohide=1&version=3&enablejsapi=1&playerapiid=ytplayer" frameborder="0" allowfullscreen=""></iframe>
</div>

  <script src="/jquery-1.7.2.min.js"></script>
  <script type="text/javascript">
  var player;
 function onYouTubePlayerAPIReady() {
  player = new YT.Player('ytplayer', {
    events: {
        'onStateChange': ShowMe
       }
    });
 }

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

    function ShowMe() {

    var sStatus;
    sStatus = player.getPlayerState();

      if (sStatus == -1) alert("Video has not started.");
      else if (sStatus == 0) {  $('#ytplayer').replaceWith('<a href="page/" target="_blank"><img class="special_hover" src="image" alt="" /></a>')
   //change above function to react to when the player stops.
  }
     else if (sStatus == 1) { } //Video is playing
     else if (sStatus == 2) {}  //Video is paused
     else if (sStatus == 3) { } //video is buffering
     else if (sStatus == 5) { } //Video is cued.
   }

  </script>

这篇关于如何在嵌入式 YouTube iFrame 端触发功能的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！