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(); // 暂停视频
                    }
                }
            }
        }
    };
})();
相关推荐
Cxiaomu2 分钟前
React Native 双端一体工程,如何实现分端运行与分端打包?
javascript·react native·react.js
冰暮流星38 分钟前
javascript之dom访问属性
开发语言·javascript·dubbo
一只小阿乐41 分钟前
TypeScript中的React开发
前端·javascript·typescript·react
Highcharts.js1 小时前
Highcharts客户端导出使用文档说明|图表导出模块讲解
前端·javascript·pdf·highcharts·图表导出
华仔啊1 小时前
GitHub 25k Star!这款开源录屏工具,免费无水印可商用,彻底告别付费
javascript
一只小阿乐1 小时前
react路由中使用context
前端·javascript·react.js·context 上下文
Hilaku1 小时前
一周狂揽40K+ Star⭐ 的 Pretext 到底有多变态?
前端·javascript·html
前端郭德纲1 小时前
JavaScript 原型相关属性详解
开发语言·javascript·原型模式
533_1 小时前
适用于vue3的拖拽插件:vue-draggable-plus, vuedraggable@next
javascript·vue.js
早點睡3901 小时前
ReactNative项目OpenHarmony三方库集成实战:react-native-shadow-2
javascript·react native·react.js