哔哩哔哩双击播放器全屏的 js 代码问题

V2EX = way to explore

V2EX 是一个关于分享和探索的地方

现在注册

已注册用户请登录

这是一个创建于 1500 天前的主题，其中的信息可能已经有所发展或是发生改变。

我在 Chrome 83 开发者工具的 console 这一栏里执行下面的 js 代码——想实现双击播放器全屏的功能，但是没效果，请大家帮我看看是什么原因？

document.querySelector('.bilibili-player-video video').ondblclick = document.querySelector('.bilibili-player-video-btn-fullscreen').click

改成这样也不行

document.querySelector('.bilibili-player-video video').ondblclick =function(){
            document.querySelector('.bilibili-player-video-btn-fullscreen').click();
           
}

大家可以用这个视频帮我测试，谢谢！！！ https://www.bilibili.com/video/BV1wx411x7Yb?p=4

4 条回复

ysc3839

2020-10-13 23:54:36 +08:00

因为点击事件不是由 video 元素处理的。刚刚看了一下是由 class 为 bilibili-player-dm-tip-wrap 的 div 处理的，所以代码改成
document.querySelector('.bilibili-player-dm-tip-wrap').ondblclick = function() {
document.querySelector('.bilibili-player-video-btn-fullscreen').click();
}
即可

sixway

2020-10-14 00:11:12 +08:00

我找了半天，终于找到了。返回来刷新发现楼上已经发出来了。

iMath

2020-10-14 15:58:22 +08:00

@ysc3839 厉害，果然有效！
"因为点击事件不是由 video 元素处理的。刚刚看了一下是由 class 为 bilibili-player-dm-tip-wrap 的 div 处理的"
请问一下这一点你是怎么探测出来的？能否指点下方法，谢谢！

iMath

2020-10-14 15:58:50 +08:00

@sixway 同样感谢你，干杯！