bookmarklet:获取嵌入式 iframe youtube 播放器的当前时间?
bookmarklet: getting current time of embedded iframe youtube player?
我是 javascript 开发新手。我有一个小书签,可以获取 youtube 视频的当前时间。
javascript:(function(){
ytplayer = document.getElementById("movie_player");
var secs = ytplayer.getCurrentTime();
alert(`${secs}`);
})();
它在 youtube.com 上运行良好。但是,当我将相同的逻辑应用于基于 iframe 的网站时 (url here)。根据 youtube API 参考,我使用 function onYouTubePlayerAPIReady()
。但是当我 运行 小书签时什么也没有发生。这是代码
javascript:function onYouTubePlayerAPIReady() {
var ytplayer = new YT.Player('widget2');
var secs = ytplayer.getCurrentTime();
alert(`${secs}`);
}
youtube API 专家能发现问题吗?
这是来自网站the sample youtube的iframe
<iframe frameborder="0" allowfullscreen="1" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" title="YouTube video player" width="100%" height="100%" src="https://www.youtube.com/embed/eSWwIQzKsbY?autoplay=1&mute=0&controls=1&start=0&origin=https%3A%2F%2Fyou-tldr.com&playsinline=1&showinfo=0&rel=0&iv_load_policy=3&modestbranding=1&enablejsapi=1&widgetid=1" id="widget2" data-gtm-yt-inspected-1_25="true"></iframe>
是的。我有类似的需求。我不认为你调用了 onYouTubeIframeAPIReady()
函数。这是工作代码。
function onYouTubeIframeAPIReady() {
var player = new YT.Player('widget2', {//The id of the div containing the iframe. Should be changed based on the page you're at and the i they gave their player
events: {
'onStateChange': onPlayerStateChange//Event listener, fires onPlayerStateChange function whenever the state of the video changes, paused or played
}
});
function onPlayerStateChange() {
currentTime = player.playerInfo.currentTime;//Current Time saved
if (player.playerInfo.playerState === 2) {//If video paused, console.log the time
console.log(currentTime);
}
}
}
onYouTubeIframeAPIReady();//Initial call to the function
我是 javascript 开发新手。我有一个小书签,可以获取 youtube 视频的当前时间。
javascript:(function(){
ytplayer = document.getElementById("movie_player");
var secs = ytplayer.getCurrentTime();
alert(`${secs}`);
})();
它在 youtube.com 上运行良好。但是,当我将相同的逻辑应用于基于 iframe 的网站时 (url here)。根据 youtube API 参考,我使用 function onYouTubePlayerAPIReady()
。但是当我 运行 小书签时什么也没有发生。这是代码
javascript:function onYouTubePlayerAPIReady() {
var ytplayer = new YT.Player('widget2');
var secs = ytplayer.getCurrentTime();
alert(`${secs}`);
}
youtube API 专家能发现问题吗?
这是来自网站the sample youtube的iframe
<iframe frameborder="0" allowfullscreen="1" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" title="YouTube video player" width="100%" height="100%" src="https://www.youtube.com/embed/eSWwIQzKsbY?autoplay=1&mute=0&controls=1&start=0&origin=https%3A%2F%2Fyou-tldr.com&playsinline=1&showinfo=0&rel=0&iv_load_policy=3&modestbranding=1&enablejsapi=1&widgetid=1" id="widget2" data-gtm-yt-inspected-1_25="true"></iframe>
是的。我有类似的需求。我不认为你调用了 onYouTubeIframeAPIReady()
函数。这是工作代码。
function onYouTubeIframeAPIReady() {
var player = new YT.Player('widget2', {//The id of the div containing the iframe. Should be changed based on the page you're at and the i they gave their player
events: {
'onStateChange': onPlayerStateChange//Event listener, fires onPlayerStateChange function whenever the state of the video changes, paused or played
}
});
function onPlayerStateChange() {
currentTime = player.playerInfo.currentTime;//Current Time saved
if (player.playerInfo.playerState === 2) {//If video paused, console.log the time
console.log(currentTime);
}
}
}
onYouTubeIframeAPIReady();//Initial call to the function