var vid1 = document.getElementById("v1");
var vid2 = document.getElementById("v2");
var vidArr = [vid1,vid2];
var tempListener1 = function checkViewA(){
if(elementInView(vid1)){
playVideo(vid1);
window.removeEventListener('scroll', tempListener1); // so the video only plays once
}
}
var tempListener2 = function checkViewB(){
if(elementInView(vid2)){
playVideo(vid2);
window.removeEventListener('scroll', tempListener2);
}
}
// scroll event listeners
window.addEventListener('scroll', tempListener1);
window.addEventListener('scroll', tempListener2);
// this plays the video
async function playVideo(v){
v.play();
}
我希望能够继续添加观看时播放的视频，而不必继续添加变量，事件监听器。在javascript中，您无法删除具有带有参数的函数的侦听器，这就是为什么我将它们放入变量中。任何见解都将受到欢迎。
首先得到集中所有视频元素的集合，然后添加一个单一的滚动监听器。当侦听器运行时，遍历Set。只要找到观看的视频，就播放并将其从Set中删除：
const videos = new Set(document.querySelectorAll('video'));
window.addEventListener('scroll', () => {
for (const video of videos) {
if (elementInView(video)) {
video.play();
videos.delete(video);
}
}
});
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句