Iframe Youtube Javascript API:开始参数不适用于重播
我正在使用Youtube Javascript API(iframe版本),并使用Iframe Youtube Javascript API:开始参数不适用于重播,iframe,youtube,embed,replay,Iframe,Youtube,Embed,Replay,我正在使用Youtube Javascript API(iframe版本),并使用start和end参数,以便仅播放视频的一部分。当一切正常时,一旦到达端,玩家就会停止(正常行为)。但是,当再次单击播放时,玩家似乎没有考虑开始选项。它总是从视频开始重新开始播放。但是,它始终在定义的结束值处结束 <iframe frameborder="0" src="https://www.youtube.com/embed/5lGoQhFb4NM?autoplay=1&autohide=1&am
start
和end
参数,以便仅播放视频的一部分。当一切正常时,一旦到达端
,玩家就会停止(正常行为)。但是,当再次单击播放时,玩家似乎没有考虑开始选项。它总是从视频开始重新开始播放。但是,它始终在定义的结束
值处结束
<iframe frameborder="0" src="https://www.youtube.com/embed/5lGoQhFb4NM?autoplay=1&autohide=1&modestbranding=1&showinfo=0&controls=0&vq=hd720&rel=0&start=60&end=100" style="width: 100%; height: 400px;"></iframe>
你们知道为什么会发生这种情况吗?以下是我如何让重播按钮在原始的
开始时间重新开始,以及防止用户滚动到PlayerBars
的开始/结束界限之外:
function onPlayerStateChange(event) {
var isClip = playerOptions.playerVars.start && playerOptions.playerVars.end;
var start = isClip ? playerOptions.playerVars.start : null;
var end = isClip ? playerOptions.playerVars.end : null;
if (event.data == YT.PlayerState.PLAYING) {
if (isClip) {
var currentTime = event.target.getCurrentTime();
if (currentTime < start || currentTime > end) {
event.target.seekTo(playerOptions.playerVars.start);
}
}
}
}
函数onPlayerStateChange(事件){
var isClip=playerOptions.playerVars.start&&playerOptions.playerVars.end;
var start=isClip?playerOptions.playerVars.start:null;
var end=isClip?playerOptions.playerVars.end:null;
if(event.data==YT.PlayerState.PLAYING){
如果(isClip){
var currentTime=event.target.getCurrentTime();
如果(当前时间<开始| |当前时间>结束){
event.target.seekTo(playerOptions.playerVars.start);
}
}
}
}
我尝试了上述解决方案,但没有成功(错误控制台:“playerOptions未定义”)
但是对于本主题,我已经能够成功地在重播中获得开始/结束参数:
<script>
// 5. The API calls this function when the player's state changes.
var done = false;
function onPlayerStateChange(event) {
if (event.data == YT.PlayerState.ENDED) {
var playButton = document.getElementById("play");
playButton.addEventListener("click", function() {
player.loadVideoById({
videoId: videoId,
startSeconds: startSeconds,
endSeconds: endSeconds
});
});
document.getElementById("play").style.cssText = "visibility:visible";
}
}
</script>
// 5. 当播放器的状态改变时,API调用此函数。
var done=false;
函数onPlayerStateChange(事件){
如果(event.data==YT.PlayerState.end){
var playButton=document.getElementById(“play”);
playButton.addEventListener(“单击”,函数(){
player.loadVideoById({
videoId:videoId,
开始秒:开始秒,
endSeconds:endSeconds
});
});
document.getElementById(“play”).style.cssText=“可见性:可见”;
}
}
说明:在我的例子中,我使用一个按钮id=“play”来启动视频。视频结束后,按钮“播放”设置为“可见性:可见”,单击事件使用player.loadVideoById对应的参数。
如果不使用“单击”事件,视频将以所需的开始/结束值自动循环
从Youtube API reference=你最终做了什么?@httpete好吧,因为我最初使用Angular,所以我最终使用它,它允许我使用事件Youtube.player.end
重新加载iframe。如果您感兴趣,我将在这里发布我的解决方案作为答案,请告诉我:)