Javascript Youtube api - 停止视频
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/6671232/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Youtube api - stop video
提问by Madr
I need some help with Youtube API and embeded videos. I want to stop video when clicked on some element (div,link,td etc.). I am trying to get it work just for 1 video now, but the final function of this script should be to stop all videos loaded on current page. I have read thru the YT API documentation but Im really beginner in JS so its still quite hard to understand for me.
我需要一些有关 Youtube API 和嵌入视频的帮助。单击某个元素(div、link、td 等)时,我想停止视频。我现在试图让它只为 1 个视频工作,但这个脚本的最终功能应该是停止当前页面上加载的所有视频。我已经通读了 YT API 文档,但我真的是 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>
thanks in advance for any advices
提前感谢您的任何建议
回答by Jordan
You can't control it if you embed it with an iframe. You have to use object embedding, like this:
如果将其嵌入 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>
The rest of your code should generally work after that, although it may need to be updated to say:
您的其余代码通常应该在此之后工作,尽管可能需要更新以说明:
<a href="javascript:document.getElementById('ytplayer').stopVideo()">Play</a>
Also, have you seen the demo site? http://code.google.com/apis/youtube/youtube_player_demo.html
另外,你看过演示网站吗?http://code.google.com/apis/youtube/youtube_player_demo.html
回答by frisseprins
I recently wrote a little jquery for this, from the youtube api
我最近从 youtube api 为此编写了一个小 jquery
I wanted to stop all videos from playing with a single action
我想通过一个动作停止播放所有视频
<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>
or to stop a single video:
或停止单个视频:
$('.stop').click( function() {
playerVariableName.stopVideo();
});
回答by Eric Yang
Not familiar with the youtube api, but this should work assuming your other code is correct:
不熟悉 youtube api,但假设您的其他代码正确,这应该可以工作:
<script type="text/javascript">
player = document.getElementById('ytplayer');
function stop(){
player.stopVideo();
return false;
}
</script>
<a href="#" onclick="stop()">Play</a>
Insert this into the place of your <a href="javascript:ytplayer.stopVideo()">Play</a>
tag.
将此插入您的<a href="javascript:ytplayer.stopVideo()">Play</a>
标签位置。