当页面上的所有视频都处于"ON READY“状态时,有没有可能获得信息?(我需要知道这些信息,之后我会做另一个JS事件)。
所有关于SO / Google搜索的例子都只有一个视频。我在文档中没有找到任何东西。
谢谢。
发布于 2018-06-08 03:53:35
您可以使用setter和getters创建类似于变量侦听器(在本例中是计数器侦听器)的内容。然后,您可以指定页面上的视频数量,并在每次加载视频时增加计数器。
每次加载视频时,计数器都会增加,您可以检查计数器是否等于视频总数。当计数器等于该数字时,则意味着所有视频都已加载,您可以执行任何您想要的操作。
下面代码片段中的函数videoHasBeenLoaded()
应该用作on ready state
视频侦听器的回调(这里我使用setTimout
来模拟该事件)。
function videoHasBeenLoaded() {
loaded.counter++;
console.log(`video has been loaded (no. of loaded videos: ${loaded.counter})`);
}
const loaded = {
_counter: 0,
listener: function() {},
set counter(val) {
this._counter = val;
this.listener(val);
},
get counter() {
return this._counter;
},
registerListener: function(listener) {
this.listener = listener;
}
}
loaded.registerListener(function(val) {
const numberOfVideos = 3;
if (loaded.counter === numberOfVideos) {
alert(`all (${numberOfVideos}) videos have been loaded`);
// you code goes here
}
});
setTimeout(videoHasBeenLoaded, 1000);
setTimeout(videoHasBeenLoaded, 2000);
setTimeout(videoHasBeenLoaded, 3000);
没有使用全局计数器的getters和setters的ES5版本。
var counter = 0;
function videoHasBeenLoaded() {
counter++;
console.log(`video has been loaded`);
allVideosReadyCallback(counter);
}
function allVideosReadyCallback(counter) {
var numberOfVideos = 3;
if (counter === numberOfVideos) {
alert(`all videos have been loaded`);
// you code goes here
}
}
setTimeout(videoHasBeenLoaded, 1000);
setTimeout(videoHasBeenLoaded, 2000);
setTimeout(videoHasBeenLoaded, 3000);
https://stackoverflow.com/questions/50748844
复制相似问题