Javascript 如何在初始化多个视频时获取Plyr当前实例
我在我的网页中使用来播放Youtube嵌入的内容。在我的页面中,我有大约10个视频/嵌入,我当前的设置如下所示: HTMLJavascript 如何在初始化多个视频时获取Plyr当前实例,javascript,youtube,embed,plyr,plyr.js,Javascript,Youtube,Embed,Plyr,Plyr.js,我在我的网页中使用来播放Youtube嵌入的内容。在我的页面中,我有大约10个视频/嵌入,我当前的设置如下所示: HTML <div class="plyr" data-plyr-provider="youtube" data-plyr-embed-id="videoID1"></div> <div class="plyr" data-plyr-provider="youtube" data-plyr-embed-id="videoID2"></div&
<div class="plyr" data-plyr-provider="youtube" data-plyr-embed-id="videoID1"></div>
<div class="plyr" data-plyr-provider="youtube" data-plyr-embed-id="videoID2"></div>
<div class="plyr" data-plyr-provider="youtube" data-plyr-embed-id="videoID3"></div>
<div class="plyr" data-plyr-provider="youtube" data-plyr-embed-id="videoID4"></div>
<div class="plyr" data-plyr-provider="youtube" data-plyr-embed-id="videoID5"></div>
<div class="plyr" data-plyr-provider="youtube" data-plyr-embed-id="videoID6"></div>
<div class="plyr" data-plyr-provider="youtube" data-plyr-embed-id="videoID7"></div>
<div class="plyr" data-plyr-provider="youtube" data-plyr-embed-id="videoID8"></div>
<div class="plyr" data-plyr-provider="youtube" data-plyr-embed-id="videoID9"></div>
<div class="plyr" data-plyr-provider="youtube" data-plyr-embed-id="videoID10"></div>
现在,如果我在页面上播放视频#3,我如何获得该实例,以便我可以控制播放器&聆听该实例事件,以便我可以对这些事件做其他事情
当只实例化一个播放器时,文档只讨论单个实例
const player = new Plyr('#player', options);
但是我一次实例化了多个…您应该做的是像这样将变量添加到
数据plyr config
<div class="plyr" data-plyr-provider="youtube" data-plyr-embed-id="videoID10" data-plyr-config='{ "the_id": "YOUR ID" }'></div>
- 其中'u id'是您刚刚创建的密钥
- 注意:密钥名称可以是任何内容
<div class="plyr" data-plyr-provider="youtube" data-plyr-embed-id="videoID10" data-plyr-config='{ "the_id": "YOUR ID" }'></div>
const plyr = Plyr.setup('. plyr', config);
plyr.forEach(function (instance) {
instance.on('playing', function () {
console.log(instance.config.the_id);
});
});