当用户在javascript中退出全屏时，如何取消选中复选框？

Question

我有一个 ID 为“全屏”的复选框元素。单击复选框使用户进入全屏模式。但是，如果用户使用 f11 退出全屏模式，该复选框仍处于选中状态。

我正在寻找如下脚本：

如果复选框“全屏”被选中，并且“onfullscreenchange” 事件发生

然后，取消选中 ID 为“全屏”的复选框。

这就是我现在拥有的： 它不起作用--

var el = document.getElementById('fullscreen');
if (el.checked == true){
document.onfullscreenchange = function ( event ) { 
  el.checked = false;
}; 
  }) );

我该怎么做？请帮忙！

Answer 1

您可以使用带有供应商前缀的 onfullscreenchange 事件侦听器来侦听全屏更改并执行任何需要的操作，例如。

document.addEventListener("webkitfullscreenchange", function (event) { 
  var el = document.getElementById('fullscreen');
  if(document.webkitFullscreenElement === null) {
    elem.checked = false
  }
}); 

或者

["fullscreenchange", "webkitfullscreenchange", "mozfullscreenchange", "msfullscreenchange"].forEach(
prefixed => document.addEventListener(prefixed, function() {
  var el = document.getElementById('fullscreen');
  el.checked = false;

}) );