Question

以下两个代码块在Firefox＆amp; Chrome和IE浏览器边缘。第一个块在单击时展开图像以填充屏幕，第二个块在第二次单击时再次缩小图像。

问题在于，虽然第一个代码块在所有四个浏览器中扩展了图像，但是IE＆amp; Edge（与Firefox和Chrome不同）也可以立即运行第二个块而无需等待第二次点击。如何阻止这两个浏览器这样做？

我尝试在每个块的末尾添加分号无效。

部分代码如下：

Block One - 将图片展开到全屏

var globalreqfullscreen = getreqfullscreen() 
document.addEventListener('click', function(e){
    var target = e.target
    if (target.classList.contains('canfullscreen')){
    globalreqfullscreen.call(target)
    }
}, false)

第二块 - 收缩扩展图像

var globalexitfullscreen = getexitfullscreen() 
document.addEventListener('click', function(e){
    var target = e.target
    if (target.classList.contains('canfullscreen')){
   globalexitfullscreen.call(document)
}
}, false)

感谢您在一夜之间发表的三条评论：

我还尝试了一种切换方法，使用Block 3替换Block 1＆amp; 2.这会扩展到所有四个浏览器，但不会在第二次点击时关闭。但是，如果我拿出第二个到最后一个}然后Firefox＆amp; Chrome仍然会通过单独的点击进行扩展和收缩，但IE和Edge会扩展并立即与初始点击签订合同。我似乎走了一圈： - （

第三组 - 切换方法

var globalreqfullscreen = getreqfullscreen() // get supported ver of requestFullscreen()
var globalexitfullscreen = getexitfullscreen() // get supported ver of document.exitFullscreen()
var globalfullscreenelement = fullscreenelement() // get supported ver of document.fullscreenElement()

document.addEventListener('click', function(e){
var target = e.target
if (target.classList.contains('canfullscreen')){
  if (globalfullscreenelement == null){ // if browser is currently not in full screen 
        globalreqfullscreen.call(target)
    }
    else{
        globalexitfullscreen.call(document)
    }
}

}，false）

更新：我现在有一个适用于所有四种浏览器的切换设置。在我付出更多钱之后会更新这个。谢谢大家，唐

第一块代码在Firefox，Chrome，IE和＆amp;边缘，但IE＆amp;边缘过早地运行第二块

0 个答案: