原生JS点击图标全屏esc、f11退出全屏

这样写在mac系统上功能是完好的
但是win系统上有问题,我也不知道为什么,求解答。
html部分:


      
        
      
      

js部分:

handleFullScreen () { // 全屏
      let element = document.documentElement
      if (this.fullscreen) {
        this.exitFull()
      } else {
        if (element.requestFullscreen) {
          element.requestFullscreen()
        } else if (element.webkitRequestFullScreen) {
          element.webkitRequestFullScreen()
        } else if (element.mozRequestFullScreen) {
          element.mozRequestFullScreen()
        } else if (element.msRequestFullscreen) {
          element.msRequestFullscreen()
        }
      }
      this.fullscreen = !this.fullscreen 
      window.onresize = () => { 
        if (!this.checkFull()) {
          this.fullscreen = false //恢复图标
        }
      }
      document.onkeydown = (event) => {//监听f11按键
        if (event.keyCode === 122) {
          this.exitFull()
          this.fullscreen = false
        }
      }
    },
    exitFull () { //退出全屏
      if (document.exitFullscreen) {
        document.exitFullscreen()
      } else if (document.webkitCancelFullScreen) {
        document.webkitCancelFullScreen()
      } else if (document.mozCancelFullScreen) {
        document.mozCancelFullScreen()
      } else if (document.msExitFullscreen) {
        document.msExitFullscreen()
      }
    },
    checkFull () {
      var isFull = document.fullscreenEnabled || window.fullScreen || document.webkitIsFullScreen || document.msFullscreenEnabled
      if (isFull === undefined) isFull = false
      return isFull
    }

你可能感兴趣的:(JS)