我想使用“Youtube Iframe API”为 Youtube 视频添加字幕。Youtube 播放器对象是使用 iframe API 创建的,列出了播放器的两个视频。
以下是我的示例代码:
<html>
<head>
<title>Video Player</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script>
function Player(options) {
var defaults = {
height: '250',
width: '500',
events: { 'onReady': null},
cc_load_policy :1,
playerVars: {
modestbranding: 0,
controls: 0, //remove controls
showinfo: 0,
version:2,
enablejsapi : 1,
iv_load_policy: 3,
cc_load_policy :1
}
};
var combinedOptions = $.extend(defaults, options);
return {
player: null,
pause: function () {
this.player.pauseVideo();
},
seek: function () {
//this.player.seekTo();
},
destroy: function () {
this.player.destroy();
},
changeVideo: function () {
this.player.stopVideo();
},
onPlayerReady: function( a, b, c, d ) {
myPlayer.player.playVideo();
myPlayer.player.cuePlaylist({playlist:['u1zgFlCw8Aw','M7lc1UVf-VE'], startSeconds:0 });
},
onStateChange:function( a, b, c, d ){
//myPlayer.player.seekTo(50);
},
init: function() {
me = this;
me.player = new YT.Player(combinedOptions.id, {
height: combinedOptions.height,
width: combinedOptions.width,
events: {
'onReady': this.onPlayerReady,
'onStateChange': this.onStateChange
}
});
}
}
};
var myPlayer;
function onYouTubeIframeAPIReady() {
myPlayer = new Player({
id: 'divId',
autoPlay: true,
videoId: 'NeGe7lVrXb0',
});
myPlayer.init();
}
$(document).ready(function() {
var tag = document.createElement('script');
tag.src = "https://www.youtube.com/iframe_api";
var firstScriptTag = document.getElementsByTagName('script')[0];
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
});
function playPause()
{
if (myPlayer.player.getPlayerState() == 1)
myPlayer.player.pauseVideo();
else
myPlayer.player.playVideo();
}
function addTime()
{
var playerObj = myPlayer.player;
var currentTime = playerObj.getCurrentTime();
playerObj.seekTo(currentTime+10);
}
function removeTime()
{
var playerObj = myPlayer.player;
var currentTime = playerObj.getCurrentTime();
playerObj.seekTo(currentTime-10);
}
function makeBig()
{
me.player.a.width=600;
me.player.a.height=350;
}
function makeSmall()
{
me.player.a.width=350;
me.player.a.height=200;
}
</script>
</head>
<body>
<div style="text-align:center" >
<button onclick="playPause()">Play/Pause</button>
<button onclick="removeTime()">10-</button>
<button onclick="addTime()">10+</button>
<button onclick="makeBig()">Big</button>
<button onclick="makeSmall()">Small</button>
<button onclick="makeBig()">Big</button>
<br>
<div style="text-align:center" id="divId">
</div>
</body>
</html>
有什么帮助吗? 提前致谢...
最佳答案
API 文档中没有描述,但在这里
this.player.loadModule("captions");
关于javascript - 如何使用 "Youtube Iframe API "将字幕添加到 YouTube 视频,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/21798398/