Javascript 本机视频播放器:从按键中删除事件处理程序
我正在构建一个基于web的视频播放平台,需要完全控制视频标签的回放行为。 具体来说,我想实现自己的清理功能。为此,我想禁用本机行为,通过按“向左箭头”、“向右箭头”和“空格”来跳过重放焦点中的视频标记,并创建我自己的键盘控件 我已经实现了一个全局击键功能,可以从任何地方控制视频播放器:Javascript 本机视频播放器:从按键中删除事件处理程序,javascript,html5-video,arrow-keys,Javascript,Html5 Video,Arrow Keys,我正在构建一个基于web的视频播放平台,需要完全控制视频标签的回放行为。 具体来说,我想实现自己的清理功能。为此,我想禁用本机行为,通过按“向左箭头”、“向右箭头”和“空格”来跳过重放焦点中的视频标记,并创建我自己的键盘控件 我已经实现了一个全局击键功能,可以从任何地方控制视频播放器: window.addEventListener('keyup', this.keyboardControl); 为了停止聚焦视频播放器,使其自行对按键做出反应,我尝试覆盖如下处理程序: let video =
window.addEventListener('keyup', this.keyboardControl);
为了停止聚焦视频播放器,使其自行对按键做出反应,我尝试覆盖如下处理程序:
let video = document.getElementById('video');
video.addEventListener("keydown", function(event){
event.preventDefault();
});
video.addEventListener("keypress", function(event){
event.preventDefault();
});
video.addEventListener("keyup", function(event){
event.preventDefault();
});
使用target.removeEventListener(type,listener[,options])删除事件侦听器代码>,我需要知道执行的本机函数的名称,我认为不同的浏览器会有所不同
有办法吗?谢谢大家
编辑:
我正在视频标签中使用属性“controls”。如果我要删除它,它会工作,但也会松开GUI控件,这是我需要的。
此外,我可以测试的所有浏览器(Chrome、FF、Safari)都会出现这种情况。您必须咬紧牙关,放弃控件属性,创建自己的自定义控件。这部分代码其实并不多,但如果你想用一个漂亮的GUI来代替它,可能需要一点谷歌搜索或微软绘图
你正在尝试做一些类似于Youtube和Vimeo的事情,所以去看看他们的视频播放器,从中获得灵感。试着不要对它们有多复杂感到困惑,只要基本上理解它们都是JS、HTML和CSS。他们自己制作按钮、洗涤器、“像”、“共享”等等
额外的好处是你的玩家在所有浏览器中看起来都一样
如果你想打电话给它,有开源的: