【发布时间】:2012-12-09 23:48:18
【问题描述】:
我在 Windows 8 应用程序 (html/javascript) 中嵌入了 youtube 播放器。我需要与玩家互动(播放/暂停等)。我在入门部分here 中复制/粘贴了示例,但未触发 onYouTubeIframeAPIReady。我为相同的代码创建了本地 html 文件,并在 chrome 中启动了 html 文件,但结果相同。当我使用 w3schools 尝试页面时,此代码工作正常。 我找到了与 youtube 播放器 here 交互的更好示例。我在桌面本地复制了 index.js、index.html 和 index.css。尝试从桌面运行 index.html 不起作用(基本上 onYouTubeIframeAPIReady 未触发)。
我的最终目标是知道视频何时在 win8 javascript/html 应用程序中播放完毕。我试图让上面的例子首先在本地工作,但到目前为止还没有成功。
感谢您的帮助!!!!
P.S:相关问题很少(例如:http://stackoverflow.com/questions/12844668/controlling-an-iframe-youtube-player-within-a-windows-8-metro-js-app) stackoverflow,但我找不到答案。由于我的声誉低,我也无法发表评论:)。
编辑:这是我在本地使用的实际HTML:
<!DOCTYPE html>
<html>
<body>
<!-- 1. The <iframe> (and video player) will replace this <div> tag. -->
<div id="player"></div>
<script>
// 2. This code loads the IFrame Player API code asynchronously.
var tag = document.createElement('script');
tag.src = "//www.youtube.com/iframe_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 onYouTubeIframeAPIReady() {
player = new YT.Player('player', {
height: '390',
width: '640',
videoId: 'u1zgFlCw8Aw',
events: {
'onReady': onPlayerReady,
'onStateChange': onPlayerStateChange
}
});
}
// 4. The API will call this function when the video player is ready.
function onPlayerReady(event) {
event.target.playVideo();
}
// 5. The API calls this function when the player's state changes.
// The function indicates that when playing a video (state=1),
// the player should play for six seconds and then stop.
var done = false;
function onPlayerStateChange(event) {
if (event.data == YT.PlayerState.PLAYING && !done) {
setTimeout(stopVideo, 6000);
done = true;
}
}
function stopVideo() {
player.stopVideo();
}
</script>
</body>
</html>
【问题讨论】:
-
@arttronics - 感谢您的回复。我没有在此处发布代码,而是指向链接。请在此处查看示例 html 页面示例 developers.google.com/youtube/… 我在本地 html 文件中复制了相同的代码。
标签: javascript microsoft-metro youtube-api youtube-javascript-api