【问题标题】:Check whether an embeded youtube video has started检查嵌入的 youtube 视频是否已开始
【发布时间】:2013-09-27 12:45:14
【问题描述】:

我有一个嵌入 YouTube 视频的脚本。

这是我的脚本

<object width="500" height="375">
    <param name="movie" 
               value="http://www.youtube.com/v/mLDTfRDM_LE?version=3&autohide=1&showinfo=0&enablejsapi=1">
        </param>
    <param name="allowScriptAccess" value="always">
        </param>
    <embed src="http://www.youtube.com/v/mLDTfRDM_LE?version=3&autohide=1&autoplay=1&showinfo=0&rel=0&enablejsapi=1" 
               type="application/x-shockwave-flash" 
               allowscriptaccess="always" 
               width="500" height="375">
        </embed> 
        </object>

现在我想检查视频是否已经开始,并据此提醒:

"Hii video has started"

有类似这个问题的链接:https://stackoverflow.com/questions/16215658/checking-whether-an-embedded-youtube-video-has-started

但我有不同的脚本。

【问题讨论】:

    标签: html youtube youtube-api


    【解决方案1】:

    大致思路是这样的:

    1) 您需要在&lt;embed&gt; 元素上添加一个id 属性——这将允许您收听播放器事件。您将在下一步中需要它。此示例假定嵌入 ID 为“myPlayer”

    2) 在您的页面上包含此脚本,就在关闭正文之前:

    <script>
    function onYouTubePlayerReady(playerId) {
            ytplayer = document.getElementById("myPlayer");
            ytplayer.addEventListener("onStateChange", "onytplayerStateChange");
    }
    
    function onytplayerStateChange(newState) {
            if (newState=="1") {
                    alert("Hii video has started");
            }
    }
    </script>
    

    onYouTubePlayerReady 函数在播放器加载并准备就绪时自动运行;这个脚本会在那个时候设置一个监听器,如果它听到一个状态改变事件告诉你视频正在播放,它会做你想要的警报。

    注意一些非常重要的事情。这种方法在 IE 上经常不一致——你可以将它作为一个属性附加到对象元素:

    classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
    

    但更好的解决方案是不使用静态嵌入代码,而是使用 SWFObject。遵循此文档:https://developers.google.com/youtube/js_api_reference#Examples

    如果您使用 jQuery,另一种可能是 tubePlayer 插件:http://www.tikku.com/jquery-youtube-tubeplayer-plugin

    当然,我最大的建议是根本不使用 AS3 嵌入,而是使用 iFrame:https://developers.google.com/youtube/iframe_api_reference

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 2020-07-11
      • 2012-11-07
      • 2012-01-27
      • 2015-12-02
      • 2016-10-22
      • 2011-12-28
      • 2011-12-01
      • 2012-04-19
      相关资源
      最近更新 更多