按下播放按钮后进行回调 - Youtube 嵌入视频

Posted 2023-03-13

【中文标题】按下播放按钮后进行回调 - Youtube 嵌入视频

【英文标题】：Make callback after play button is pushed - Youtube embed video

【发布时间】：2011-12-30 11:15:59

【问题描述】：

按下播放按钮后是否可以执行 javascript 操作？我知道我需要使用 Youtube API 的 onStateChange 函数。但我真的不知道从哪里开始？有什么帮助吗？谢谢。

--

我也在这里找到了一些东西：http://apiblog.youtube.com/2011/01/introducing-javascript-player-api-for.html

【参考方案1】：

这是一个您应该能够轻松扩展的解决方案：http://jsbin.com/evagof

【参考方案2】：

嘿，这就是答案。 http://jsfiddle.net/masiha/4mEDR/ 享受......如果你有更多的 qtns，请告诉我

【讨论】：

这比其他涉及 :D 的脚本更好

太棒了，我期待一些痛苦的事情，但你的解决方案非常简单。

【参考方案3】：

    <script src="http://www.google.com/jsapi" type="text/javascript"></script>
    <script type="text/javascript">
      google.load("swfobject", "2.1");
    </script>    
    <script type="text/javascript">
      // Update a particular HTML element with a new value
      function updateHTML(elmId, value) 
        document.getElementById(elmId).innerHTML = value;
      


      // This function is called when the player changes state
      function onPlayerStateChange(newState) 
        updateHTML("playerState", newState);
        if(newState === 1)
            //if the player is now playing
            //add your code here
        
      

      // This function is automatically called by the player once it loads
      function onYouTubePlayerReady(playerId) 
        ytplayer = document.getElementById("ytPlayer");
        // This causes the updatePlayerInfo function to be called every 250ms to
        // get fresh data from the player
        setInterval(updatePlayerInfo, 250);
        updatePlayerInfo();
        ytplayer.addEventListener("onPlayerStateChange");
      

      // The "main method" of this sample. Called when someone clicks "Run".
      function loadPlayer() 
        // The video to load
        var videoID = "ylLzyHk54Z0"
        // Lets Flash from another domain call JavaScript
        var params =  allowScriptAccess: "always" ;
        // The element id of the Flash embed
        var atts =  id: "ytPlayer" ;
        // All of the magic handled by SWFObject (http://code.google.com/p/swfobject/)
        swfobject.embedSWF("http://www.youtube.com/v/" + videoID + 
                           "?version=3&enablejsapi=1&playerapiid=player1", 
                           "videoDiv", "480", "295", "9", null, null, params, atts);
      
      function _run() 
        loadPlayer();
      
      google.setOnLoadCallback(_run);
    </script>
<div id="videoDiv">Loading...</div>
<p>Player state: <span id="playerState">--</span></p>

http://code.google.com/apis/ajax/playground/?exp=youtube#polling_the_player

【参考方案4】：

自发布此问题以来，YouTube 可能进行了一些更改，但大多数答案均无效。我发现最简单的方法是使用 iframe_api (https://developers.google.com/youtube/iframe_api_reference)

这是一个例子

https://thimble.webmaker.org/en-US/project/39354/edit