Fatal编程技术网

Javascript Youtube api-停止视频

javascript api video youtube

Javascript Youtube api-停止视频,javascript,api,video,youtube,Javascript,Api,Video,Youtube,我需要一些关于Youtube API和嵌入视频的帮助。 我想在点击某些元素（div、link、td等）时停止视频。我正试图让它的工作只是为1个视频现在，但这个脚本的最终功能应该是停止所有视频加载到当前页面。我已经通读了YTAPI文档，但我确实是JS的初学者，所以对我来说还是很难理解 <html> <head> <script type="text/javascript" src="swfobject.js"></script> </h

我需要一些关于Youtube API和嵌入视频的帮助。 我想在点击某些元素（div、link、td等）时停止视频。我正试图让它的工作只是为1个视频现在，但这个脚本的最终功能应该是停止所有视频加载到当前页面。我已经通读了YTAPI文档，但我确实是JS的初学者，所以对我来说还是很难理解

<html>
<head>
    <script type="text/javascript" src="swfobject.js"></script>
</head>
<body>

<a href="javascript:ytplayer.stopVideo()">Play</a>
<br/>
<iframe id="ytplayer" src="http://www.youtube.com/embed/8Ax-dAR3ABs?rel=0&iv_load_policy=3&showinfo=0&enablejsapi=1&version=3&playerapiid=ytplayer" type="application/x-shockwave-flash" frameborder="0" allowscriptaccess="always"></iframe>

</body>
</html>
提前感谢您提供任何不熟悉youtube api的建议，但前提是您的其他代码正确：

<script type="text/javascript">
    player = document.getElementById('ytplayer');

    function stop(){
        player.stopVideo();
        return false;
    }
</script>

<a href="#" onclick="stop()">Play</a>


player=document.getElementById（'ytplayer'）；
函数停止（）{
player.stopVideo（）；
返回false；
}
将其插入
标记的位置。

如果将其嵌入iframe，则无法控制它。必须使用对象嵌入，如下所示：

<object id="ytplayer" style="height: 390px; width: 640px">
    <param name="movie" value="http://www.youtube.com/v/8Ax-dAR3ABs?version=3&enablejsapi=1">
    <param name="allowScriptAccess" value="always">
    <embed id="ytplayer" src="http://www.youtube.com/v/8Ax-dAR3ABs?version=3&enablejsapi=1" type="application/x-shockwave-flash" allowfullscreen="true" allowScriptAccess="always" width="640" height="390">
</object>
代码的其余部分通常应在此之后工作，尽管可能需要更新，以说明：

<a href="javascript:document.getElementById('ytplayer').stopVideo()">Play</a>
还有，你看过演示网站了吗

我最近在youtube api上为此编写了一个小jquery

我想阻止所有视频播放一个动作

<html>
<head>
<!-- jquery -->
<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
</head>
  <body>
    <!-- player divs -->
    <div id="player1"></div>
    <div id="player2"></div>
    <div id="player3"></div>

    <a class="stop">Stop</a>

    <script>
      // load  api
      var tag = document.createElement('script');
      tag.src = "//www.youtube.com/iframe_api";
      var firstScriptTag = document.getElementsByTagName('script')[0];
      firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);

      // make player array
      var players = new Array();

      function onYouTubeIframeAPIReady() {
        players[0] = new YT.Player('player1', {
          height: '390',
          width: '640',
          videoId: 'u1zgFlCw8Aw'
        });
        players[1] = new YT.Player('player2', {
          height: '390',
          width: '640',
          videoId: 'u1zgFlCw8Aw'
        });
        players[2] = new YT.Player('player3', {
          height: '390',
          width: '640',
          videoId: 'u1zgFlCw8Aw'
        });
      }

      $('.stop').click( function() {
        //loop players array to stop them all
        $(players).each(function(i){
           this.stopVideo();
          });
      });


    </script>
  </body>
</html>
谢谢你的快速回答，但对我来说仍然不起作用。我尝试过其他swfobjects、对象嵌入、更改代码和ofc我看过演示站点，但我无法了解它们是如何播放/暂停/停止按钮的，甚至无法从它们的html/js代码中找到。我认为我的问题更可能是琐碎的（像往常一样），也许我会尝试再次阅读文档并解决它。我看到了您的swfobject链接。你为什么不发布一个JSFIDLE来描述你所拥有的，我们可以把它分解出来呢？实际上你现在可以在iframe中控制一个嵌入的YouTube视频：有一个实际的Javascript API，说你必须使用flash对象，但一个不是真的。（在给出这个答案之前，它也是可用的）注意这个答案中的重复ID，这是糟糕的HTML。您在
对象上运行API命令，而不是在
对象上运行API命令，因此id应位于嵌入状态。请使用
callPlayer（“ytplayer”，“stopVideo”）使用中的小函数。您可以尝试使用以下事件：$（“#ytplayer”）[0]。contentWindow.postMessage（“{”事件“：”命令“，”函数“：”停止视频“，”参数“：”}“，”*”）；感谢您提供的代码示例-此代码在Chrome上运行不太好，但在Safari上运行良好。我将它与此页面上的Jquery UI选项卡结合使用

$('.stop').click( function() {
   playerVariableName.stopVideo();
});