我正在使用 YouTube JavaScript API 来控制我页面上的 YouTube 播放器。目标是在我开始播放新视频时停止所有当前播放的视频。
我已经经历了不同类型的 YouTube 嵌入选项的斗争,例如单个视频、播放列表等。我遇到了一个问题,这会让我的生活更轻松。
像这样初始化播放器:
// Array to store YTplayers
var YTplayers = [];
// Select all YouTube iframes
var YTembeds = $('iframe[src*="youtube.com"], iframe[src*="youtube-nocookie.com"]');
YTEmbeds.each(function(i) {
iframe = $(this);
// Generate and add the unique identifier for the current iframe
var iframe_id = "iframe-youtube-" + i;
iframe .attr("id", iframe_id);
// Check if src already has a "?" and add "?" or "&" accordingly
// then add the necessary "enablejsapi=1" option and update the src.
var url = iframe .attr("src");
url += url.indexOf("?") == -1 ? "?" : "&";
iframe.attr("src", url + "enablejsapi=1");
// Create YouTube Player Object with custom eventListener
player = new YT.Player( iframe_id, {
events: {
'onStateChange': onYouTubePlayerStateChange
}
});
// Store the new player element and the iframe_id together
YTplayers.push({
"id" : iframe_id,
"player" : player
});
});
现在在函数 “onYouTubePlayerStateChange” 中,我可以访问“事件”对象,但是只有关于嵌入式 youTube-Player 的信息,没有任何信息……我找不到。 .. 关于周围的 iframe 对象。
所以问题是:如何在“onYouTubePlayerStateChange”函数中访问用于初始化 YT-Player 的 iframe-id?
PS:目前我使用存储在事件对象中的 video_id 或 playlist_id 来标识 iframe。但是当我有两个具有相同 YT-video_id 的播放器时,尽管这种情况不太可能发生,但他们都会继续运行。
感谢您帮助我解决这个问题。
请,
最大 K
最佳答案
所以最后我找到了一个非常简单的解决方案,通过用另一个函数包装它来将参数传递给 eventListener 函数,并传递默认的“事件”对象加上自定义定义的 iframe_id,如下所示:
player = new YT.Player( iframe_id, {
events: {
'onStateChange': function(event){
onYouTubePlayerStateChange(event, iframe_id);
}
}
});
现在,在“onYouTubePlayerStateChange”函数中,您可以访问具有播放器当前状态的 youtube-event-object 和定义它实际是哪个播放器的 iframe_id。
干杯!
关于YouTube Iframe-API : getting the iframe-id inside 'onStateChange' function,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31588547/