Chrome谷歌浏览器禁止空格下翻页但可以暂停和播放视频脚本js

前提

播放某些网站的视频的时候(不能网页全屏的视频) 会产生空格下翻页但是不能暂停播放视频,解决方案:下载油猴或者脚本猫把这代码填进去

TypeScript 复制代码
(function() {
    'use strict';

    document.body.onkeydown = function(event) {
        var e = window.event || event;

        // 检查是否按下空格键
        if (e.code === 'Space') {
            // 获取当前焦点元素
            var activeElement = document.activeElement;

            // 检查焦点是否在输入框或文本区域
            if (activeElement.tagName !== 'INPUT' &&
                activeElement.tagName !== 'TEXTAREA') {
                // 阻止空格键的默认行为(下翻页)
                e.preventDefault();

                // 查找视频元素并切换播放状态
                var video = document.querySelector('video');
                if (video) {
                    if (video.paused) {
                        video.play(); // 播放视频
                    } else {
                        video.pause(); // 暂停视频
                    }
                }
            }
        }
    };
})();
相关推荐
EasyGBS22 分钟前
视频画面模糊、卡顿、丢失?EasyGBS新增“视频质量诊断”功能,告别人工盯屏
视觉检测·音视频·gb28181·花屏·视频质量诊断·蓝屏检测
摘星编程39 分钟前
用React Native开发OpenHarmony应用:Image网络图片加载
javascript·react native·react.js
摘星编程42 分钟前
OpenHarmony环境下React Native:ImageBase64图片显示
javascript·react native·react.js
阿蒙Amon1 小时前
TypeScript学习-第13章:实战与最佳实践
javascript·学习·typescript
zhuweisky1 小时前
ArkTS实现鸿蒙手机视频聊天、屏幕分享(HarmonyOS)
音视频·harmonyos·鸿蒙开发
XHW___0011 小时前
webrtc 关键模块创建的时机
网络·音视频·webrtc
沐墨染1 小时前
Vue实战:自动化研判报告组件的设计与实现
前端·javascript·信息可视化·数据分析·自动化·vue
奔跑的呱呱牛1 小时前
viewer-utils 图片预览工具库
javascript·vue·react
Leinwin2 小时前
VibeVoice-ASR:突破60分钟长音频处理瓶颈,语音识别进入端到端时代
人工智能·音视频·语音识别
摘星编程2 小时前
React Native鸿蒙:Image本地图片显示
javascript·react native·react.js