判断window.open是否被禁用或者阻止的方法

12294次浏览

背景

在h5页面新开窗口,我们经常用window.open('haorooms.com','_blank'),但是这个方法在某些app内嵌h5中,或者某些浏览器中会阻止这个方法,那么有什么办法判断我们的open是否被阻止了呢?阻止之后我们有什么办法解决呢?今天聊聊解决方案。

解决

其实window.open有个返回值的,在打不开或者被禁用的情况下面,window.open会返回null,利用这个特性,我们可以判断这个页面目前是都可以用window.open。

例如判断如下:

  var popup = window.open("haorooms.com", "_blank");
   //popup 为null,或者undefined即为阻止

利用这个特性,我们可以封装一个函数

 function isWindowOpenUrl(url) {
  let isBlocked = false
  try{
   let popup = window.open(url, "_blank");
    if (popup == null || typeof(popup) == "undefined") {
    // 弹出窗口被拦截,window.open被禁用
    isBlocked = true
    }
   }catch(e){
    isBlocked = true
   }
  if(isBlocked){// open被阻止,我们用location.href方式打开页面了
  location.href = url
   }
}

当然,你也可以仅判断是否阻止,代码如下:

function isWindowOpenEnabled() {
  var popup = window.open("", "_blank", "width=100,height=100");
  if (popup == null || typeof(popup) == "undefined") {
    // 弹出窗口被拦截,window.open被禁用
    return false;
  } else {
    // 弹出窗口被成功打开,window.open可用
    popup.close();
    return true;
  }
}

小结

一个小的知识点,记录一下,供大家参考。

相关文章: