视频列表播放控制

预计阅读时间: 小于 1 分钟

需求场景

一页面有多个视频控制视频需要播放，但每次只能允许以个视频播放，其余视频全部暂停播放。即当点击一个视频播放时，其余在播放的视频自动暂停播放。

实现代码：

代码示例

1// 获取页面所有的还有video的元素节点
2var videoTags = document.querySelectorAll("video");
3// 修改this指向，暂停非选中的视频
4var pauseAll = function () {
5	var self = this;
6	[].forEach.call(videoTags, function (i) {
7		i !== self && i.pause();
8	});
9};
10// 播放选中的视频
11[].forEach.call(videoTags, function (i) {
12	i.addEventListener("play", pauseAll.bind(i));
13});

#视频列表播放控制

#实现代码：

视频列表播放控制

实现代码：