我正在尝试开发一个简单的脚本,该脚本基于密码提示来限制用户是否可以退出全屏模式。它的主要目的是避免博物馆的参观者将交互设备用于其主要目的以外的其他目的,该交互设备是一个浏览器应用程序,可以教一些关于那里所暴露事物的知识,因此为什么我要尝试使用JS编写此脚本。
所以我创建了一个简单的代码,该代码基本上应该监听事件fullscreenchange
并基于此事件进行操作,但这是我面临的最大问题:显然不是。
它的主要作用是: -检查是否调用了fullscreenchange; -如果是,请查看用户是否正在尝试进入或退出全屏模式; -如果用户要退出全屏模式,请要求他们输入密码; -如果密码不正确,则应再次启用全屏模式。
看看我现在有什么:
document.addEventListener("fullscreenchange", function() {
fullscreenchange();
});
document.addEventListener("mozfullscreenchange", function() {
fullscreenchange();
});
document.addEventListener("webkitfullscreenchange", function() {
fullscreenchange();
});
document.addEventListener("msfullscreenchange", function() {
fullscreenchange();
});
function fullscreenchange() {
var fullscreen = (window.fullScreen) || (window.innerWidth == screen.width && window.innerHeight == screen.height);
if(!fullscreen)
{
if(!passwordChecks()){
openFullscreen()
return;
}
}
}
function openFullscreen() {
if (elem.requestFullscreen) {
elem.requestFullscreen();
} else if (elem.mozRequestFullScreen) { /* Firefox */
elem.mozRequestFullScreen();
} else if (elem.webkitRequestFullscreen) { /* Chrome, Safari & Opera */
elem.webkitRequestFullscreen();
} else if (elem.msRequestFullscreen) { /* IE/Edge */
elem.msRequestFullscreen();
}
}
function passwordChecks(){
var pass = prompt("Enter password to leave fullscreen:");
if(pass == "leave123")
return true;
return false;
}
该脚本不会在控制台上返回任何错误(使用Chrome的DevTools)。但这也不起作用,当您尝试全屏显示时,什么也没发生,这就是为什么我提到fullscreenchange
事件显然不起作用的原因。
请让我知道此代码中是否有错误,以及如何实现最终目标。希望如此简单,但是,我真的需要您的帮助。
谢谢。