JavaScript全屏，监听页面是否全屏

javascriptlet isInFullscreen = false;
 
// 全屏请求函数
function requestFullscreen(element) {
if (element.requestFullscreen) {
element.requestFullscreen().then(() => {
isInFullscreen = true;
console.log("全屏模式已启用");
}).catch(err => {
console.error("无法进入全屏模式", err);
});
} else if (element.mozRequestFullScreen) { /* Firefox */
element.mozRequestFullScreen().then(() => {
isInFullscreen = true;
console.log("全屏模式已启用");
}).catch(err => {
console.error("无法进入全屏模式", err);
});
} else if (element.webkitRequestFullscreen) { /* Chrome, Safari 和 Opera */
element.webkitRequestFullscreen(Element.ALLOW_KEYBOARD_INPUT).then(() => {
isInFullscreen = true;
console.log("全屏模式已启用");
}).catch(err => {
console.error("无法进入全屏模式", err);
});
} else if (element.msRequestFullscreen) { /* IE/Edge */
element.msRequestFullscreen().then(() => {
isInFullscreen = true;
console.log("全屏模式已启用");
}).catch(err => {
console.error("无法进入全屏模式", err);
});
}
}
 
// 退出全屏函数
function exitFullscreen() {
if (document.exitFullscreen) {
document.exitFullscreen().then(() => {
isInFullscreen = false;
console.log("已退出全屏模式");
}).catch(err => {
console.error("无法退出全屏模式", err);
});
} else if (document.mozCancelFullScreen) { /* Firefox */
document.mozCancelFullScreen().then(() => {
isInFullscreen = false;
console.log("已退出全屏模式");
}).catch(err => {
console.error("无法退出全屏模式", err);
});
} else if (document.webkitExitFullscreen) { /* Chrome, Safari 和 Opera */
document.webkitExitFullscreen().then(() => {
isInFullscreen = false;
console.log("已退出全屏模式");
}).catch(err => {
console.error("无法退出全屏模式", err);
});
} else if (document.msExitFullscreen) { /* IE/Edge */
document.msExitFullscreen().then(() => {
isInFullscreen = false;
console.log("已退出全屏模式");
}).catch(err => {
console.error("无法退出全屏模式", err);
});
}
}
 
// 假设你有一个元素需要全屏
const element = document.documentElement; // 例如整个文档或者某个特定元素
 
// 你可以通过调用 requestFullscreen 来进入全屏模式
// requestFullscreen(element);
 
// 如果你需要监听键盘事件或其他事件来退出全屏模式，你可以调用 exitFullscreen
// exitFullscreen();
 
// 你可以通过 isInFullscreen 变量来检查当前是否在全屏模式
console.log(isInFullscreen ? "当前在全屏模式" : "当前不在全屏模式");