jQuery 检查 YouTube 视频是否正在播放并运行脚本
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/8950146/
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
Check if YouTube video is playing and run script
提问by Vian Esterhuizen
I have the following video embeded within WordPress
我在 WordPress 中嵌入了以下视频
<iframe id="video" width="640" height="360" src="http://www.youtube.com/embed/xxxxxx?enablejsapi=1" frameborder="0" allowfullscreen></iframe>
And it's inside a SlideDeck slider, which I want to stop when someone clicks the video. I can't figure out how to get this line of code
它位于 SlideDeck 滑块内，当有人单击视频时，我想停止滑块。我不知道如何获得这行代码
self.pauseAutoPlay = true;
to run when the video is playing.
在视频播放时运行。
I desperately need some help please.
我迫切需要一些帮助。
Edit:As I'm not the end user. I need something that will work with the default embed code from YouTube.
编辑：因为我不是最终用户。我需要一些可以与 YouTube 的默认嵌入代码一起使用的东西。
回答by Vian Esterhuizen
You need to use the YouTube iFrame API. Keep in mind, I know just the bare basics of Javascript and so on so this could potentially be a lot more efficient.
您需要使用 YouTube iFrame API。请记住，我只知道 Javascript 的基本知识等等，因此这可能会更有效率。
You them embed your iframe as you normally would
你像往常一样嵌入你的 iframe
<iframe id="player" width="640" height="360" src="http://www.youtube.com/embed/TJ2X4dFhAC0?enablejsapi" frameborder="0" allowfullscreen></iframe>
But with a couple changes. It needs to have an ID, 'player', and you need to append ?enablejsapito the end of the source URI.
但是有一些变化。它需要有一个 ID 'player'，并且您需要附加?enablejsapi到源 URI 的末尾。
You'll then need to run the following script to load the API JS as well as creat the player
然后，您需要运行以下脚本来加载 API JS 以及创建播放器
// 2. This code loads the IFrame Player API code asynchronously.
var tag = document.createElement('script');
tag.src = "http://www.youtube.com/player_api";
var firstScriptTag = document.getElementsByTagName('script')[0];
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
// 3. This function creates an <iframe> (and YouTube player)
// after the API code downloads.
var player;
function onYouTubePlayerAPIReady() {
player = new YT.Player('player', {
height: '390',
width: '640',
videoId: 'u1zgFlCw8Aw',
events: {
'onReady': onPlayerReady,
'onStateChange': onPlayerStateChange
}
});
}
Notice that new YT.Player('player'should match your iframe ID and that videoId: 'u1zgFlCw8Aw'should match the src URI.
请注意，它new YT.Player('player'应该与您的 iframe ID 相videoId: 'u1zgFlCw8Aw'匹配，并且应该与 src URI 相匹配。
After this you'll be able to run scripts like
在此之后，您将能够运行像这样的脚本
var myPlayerState;
function onPlayerStateChange(event) {
if (event.data == YT.PlayerState.PLAYING && !done) {
// DO THIS
}
myPlayerState = event.data;
}
if (myPlayerState == 1){
// PAUSE SLIDER
}
回答by neworld
You need embed youtube direct with flash:
您需要使用 Flash 直接嵌入 youtube：
http://code.google.com/apis/youtube/js_api_reference.html#Embedding
http://code.google.com/apis/youtube/js_api_reference.html#Embedding
after that, you can use youtube javascript API.
之后，您可以使用 youtube javascript API。
Your code could be something like that:
你的代码可能是这样的：
<script type="text/javascript" src="swfobject.js"></script>
<div id="ytapiplayer">
You need Flash player 8+ and JavaScript enabled to view this video.
</div>
<script type="text/javascript">
var params = { allowScriptAccess: "always" };
var atts = { id: "myytplayer" };
swfobject.embedSWF("http://www.youtube.com/v/VIDEO_ID?enablejsapi=1&playerapiid=ytplayer&version=3",
"ytapiplayer", "425", "356", "8", null, null, params, atts);
var player;
function onytplayerStateChange(newState) {
if (newState == 1)
callPlay();
else if (newState == 2)
callPause();
}
function callPlay() {
//video is play
}
function callPause() {
//video is paused
}
</script>
P.S. swfobject.jssoure you can find here
PS swfobject.js你可以在这里找到
