Youtube iFrame API 将数据从 onYouTubeIframeAPI 传递到 onPlayerStateChange 函数
Youtube iFrame API Passing data from onYouTubeIframeAPIReady to onPlayerStateChange function
我需要初始化 Youtube iframe 视频列表
因为有很多 youtube 视频并且列表可以从管理站点更改我需要使其动态化,这是使用 class 而不是 id
这是当前代码
const players = [];
onYouTubeIframeAPIReady(0);
onYouTubeIframeAPIReady(1);
function onYouTubeIframeAPIReady(index) {
players[index] = new YT.Player($('.wow_youtube_video')[index], {
events: {
'onStateChange': onPlayerStateChange
}
});
}
function onPlayerStateChange(event) {
// play
if(event.data == 1){
action = 'play';
}
// pause
if(event.data == 2){
action = 'pause';
}
if(event.data == 1 || event.data == 2){
dataLayer.push({
'event': 'trackEvent',
'eventDetails.category': 'videos',
'eventDetails.action': action,
'eventDetails.label': players[0].getVideoData().title // players[0] supposedly be players[index] but don't know how to pass the index balue from above function to this function
'videoName': players[0].getVideoData().title, //video name
'videoType': 'video on demand' //video type
});
}
}
如上图所示,倒数第8行
'eventDetails.label': players[0].getVideoData().title,
这里的代码
players[0]
应该是 players[index]
但我不知道如何从
传递索引值
players[index] = new YT.Player($('.wow_youtube_video')[index], {
events: {
'onStateChange': onPlayerStateChange
}
});
到onPlayerStateChange
函数
这样做的目的是为了能够携带索引值,让代码可以动态化,所以我只需要在任何youtube iframe上放上class名称wow_youtube_video就可以了作品
感谢任何帮助,谢谢
关于函数 onYouTubeIframeAPIReady
添加这个
players[index] = new YT.Player($('.wow_youtube_video')[index], {
events: {
'onStateChange': onPlayerStateChange.bind(index)
}
});
现在您可以通过
在 onPlayerStateChange
中获得 index
function onPlayerStateChange(event) {
let index = this;
console.log(index);
}
我需要初始化 Youtube iframe 视频列表
因为有很多 youtube 视频并且列表可以从管理站点更改我需要使其动态化,这是使用 class 而不是 id
这是当前代码
const players = [];
onYouTubeIframeAPIReady(0);
onYouTubeIframeAPIReady(1);
function onYouTubeIframeAPIReady(index) {
players[index] = new YT.Player($('.wow_youtube_video')[index], {
events: {
'onStateChange': onPlayerStateChange
}
});
}
function onPlayerStateChange(event) {
// play
if(event.data == 1){
action = 'play';
}
// pause
if(event.data == 2){
action = 'pause';
}
if(event.data == 1 || event.data == 2){
dataLayer.push({
'event': 'trackEvent',
'eventDetails.category': 'videos',
'eventDetails.action': action,
'eventDetails.label': players[0].getVideoData().title // players[0] supposedly be players[index] but don't know how to pass the index balue from above function to this function
'videoName': players[0].getVideoData().title, //video name
'videoType': 'video on demand' //video type
});
}
}
如上图所示,倒数第8行
'eventDetails.label': players[0].getVideoData().title,
这里的代码
players[0]
应该是 players[index]
但我不知道如何从
players[index] = new YT.Player($('.wow_youtube_video')[index], {
events: {
'onStateChange': onPlayerStateChange
}
});
到onPlayerStateChange
函数
这样做的目的是为了能够携带索引值,让代码可以动态化,所以我只需要在任何youtube iframe上放上class名称wow_youtube_video就可以了作品
感谢任何帮助,谢谢
关于函数 onYouTubeIframeAPIReady
添加这个
players[index] = new YT.Player($('.wow_youtube_video')[index], {
events: {
'onStateChange': onPlayerStateChange.bind(index)
}
});
现在您可以通过
在onPlayerStateChange
中获得 index
function onPlayerStateChange(event) {
let index = this;
console.log(index);
}