Question

我正在建立一个基于锚点和Jquery的网站，每个页面都有不同的幻灯片（它们都运行良好，只是认为我会给出一些背景知识）

现在，就是这样。在三个幻灯片上有Youtube视频，需要在导航时自动停止。所以我用“后退”按钮写了下面的字符串

onclick="player.stopVideo(); return false"

现在我遇到的问题是，Youtube API自动为播放器提供“播放器”的ID，而不是类，在API之后调用此代码行

<script>
var player;
function onYouTubePlayerAPIReady() {player = new YT.Player('player');} 
</script>

像这样的iframe

<iframe id="player" src="http://www.youtube.com/embed/TMFINFk_080?&vq=hd720" frameborder="0" allowfullscreen></iframe>

按预期完美运作。现在，我需要这个作为一个类，因为我有多个视频需要在同一页面上应用这些停止线，我完全迷失了。一位朋友建议定义一个函数来调用带有类名的任何东西的stop命令，但我不知道从哪里开始。

感谢。

作为备注：iframe非常理想，因为此页面上已经有很多代码，添加嵌入会占用更多空间，对此并不太感兴趣，但iframe提供的支持是理想的

Answer 1

`

<!DOCTYPE html>
<html lang="es">
<head>
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>   
<script type="text/javascript" src="http://www.youtube.com/player_api"></script>
<script>
var player;
function onYouTubeIframeAPIReady() {player = new YT.Player('player');}
if(window.opera){
    addEventListener('load', onYouTubeIframeAPIReady, false);
}
</script>
 </head>
<body>
<script>
$(document).ready(function(){
 });
</script>
<div id="video">
  <iframe id="player" width="560" height="349" frameborder="0" src="http://www.youtube.com/embed/vE_0V55Vywc?rel=0&wmode=Opaque&enablejsapi=1"></iframe>
</div>
<a href="javascript: void(0)" onclick="player.playVideo(); return false">play</a><br>
<a href="javascript: void(0)" onclick="player.stopVideo(); return false">stop</a>
</body>
</html>

`例如：http://jsfiddle.net/ckWLs/1/

YouTube API，定义为类和＆amp;停止视频

1 个答案: