Jquery TubePlayer 插件未按预期运行
TubePlayer 是一个 jQuery 插件,它实现了 YouTube 播放器 API,并允许我们为 YouTube 视频创建自己的控件和组件。 TubePlayer 网站 提供了入门技巧。
但是,这对我不起作用。其网站上的此页面演示了快速入门指南。我完全按照它指定的方式进行操作,但不起作用。
视频播放正常,但不知何故,控制视频的链接不起作用。
代码有什么问题吗。如果您想尝试一下,请使用以下代码:
<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/swfobject/2.2/swfobject.js"></script>
<script src="http://www.tikku.com/scripts/ui/tubeplayer/jQuery.tubeplayer.min.js"></script>
<script>
$(function(){
jQuery("#youtube-player-container").tubeplayer({
width: 600, // the width of the player
height: 450, // the height of the player
allowFullScreen: "true", // true by default, allow user to go full screen
initialVideo: "ylLzyHk54Z0", // the video that is loaded into the player
preferredQuality: "default",// preferred quality: default, small, medium, large, hd720
onPlay: function(id){}, // after the play method is called
onPause: function(){}, // after the pause method is called
onStop: function(){}, // after the player is stopped
onSeek: function(time){}, // after the video has been seeked to a defined point
onMute: function(){}, // after the player is muted
onUnMute: function(){} // after the player is unmuted
});
}) ;
</script>
</head>
<body>
<a href="#" onClick='jQuery("#youtube-player-container").tubeplayer("play")'>
Play
</a>
<a href="#" onClick='jQuery("#youtube-player-container").tubeplayer("pause")'>
Pause
</a>
<a href="#" onClick='jQuery("#youtube-player-container").tubeplayer("stop")'>
Stop
</a>
<a href="#" onClick='jQuery("#youtube-player-container").tubeplayer("mute")'>
Mute
</a>
<a href="#" onClick='jQuery("#youtube-player-container").tubeplayer("unmute")'>
Unmute
</a>
<div id='youtube-player-container'> </div>
</body>
</html>
任何人都可以帮我吗?谢谢。
TubePlayer is a jQuery Plugin that implements YouTube Player API, and allows us to create our own controls and components for YouTube videos.
The TubePlayer Website provides tips on getting started with it.
However, this is not working for me. This page on its site demonstrates a quick start guide. I followed exactly what it specified but does not work.
The video plays fine, but somehow the links to control the video do not work.
Is there anything wrong with the code. If you wanna try it out, here's the code :
<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/swfobject/2.2/swfobject.js"></script>
<script src="http://www.tikku.com/scripts/ui/tubeplayer/jQuery.tubeplayer.min.js"></script>
<script>
$(function(){
jQuery("#youtube-player-container").tubeplayer({
width: 600, // the width of the player
height: 450, // the height of the player
allowFullScreen: "true", // true by default, allow user to go full screen
initialVideo: "ylLzyHk54Z0", // the video that is loaded into the player
preferredQuality: "default",// preferred quality: default, small, medium, large, hd720
onPlay: function(id){}, // after the play method is called
onPause: function(){}, // after the pause method is called
onStop: function(){}, // after the player is stopped
onSeek: function(time){}, // after the video has been seeked to a defined point
onMute: function(){}, // after the player is muted
onUnMute: function(){} // after the player is unmuted
});
}) ;
</script>
</head>
<body>
<a href="#" onClick='jQuery("#youtube-player-container").tubeplayer("play")'>
Play
</a>
<a href="#" onClick='jQuery("#youtube-player-container").tubeplayer("pause")'>
Pause
</a>
<a href="#" onClick='jQuery("#youtube-player-container").tubeplayer("stop")'>
Stop
</a>
<a href="#" onClick='jQuery("#youtube-player-container").tubeplayer("mute")'>
Mute
</a>
<a href="#" onClick='jQuery("#youtube-player-container").tubeplayer("unmute")'>
Unmute
</a>
<div id='youtube-player-container'> </div>
</body>
</html>
Can anyone help me out please. Thanks.
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
抱歉,上面的问题是我的错。我发现了这个问题,只是在 API 文档页面中注意到了这一点。正如文档中所述,我们需要在网络服务器上使用测试脚本。不知道,我怎么错过了那部分。以后读书的时候需要更加集中注意力。
我引用了文档页面:
“任何包含 YouTube 播放器的 HTML 页面都必须实现名为 onYouTubePlayerReady 的 JavaScript 函数。当播放器完全加载且 API 准备好接收调用时,API 将调用此函数。
注意:要测试任何这些调用,您必须让文件在网络服务器上运行,因为 Flash 播放器限制本地文件和 Internet 之间的调用。 “
上面的代码工作正常。谢谢。
Sorry for the above question, my bad. I found out the problem, just noticed that in the API docs page. As stated in the documentation, we need to be on a web server with the test script. No idea, how i missed that section. Need to concentrate more often while reading in the future.
I quote the very documentation page:
" Any HTML page that contains the YouTube player must implement a JavaScript function named onYouTubePlayerReady. The API will call this function when the player is fully loaded and the API is ready to receive calls.
Note: To test any of these calls, you must have your file running on a webserver, as the Flash player restricts calls between local files and the internet. "
The above code works fine. Thanks.