问题:同一个项目,同一个浏览器,不同模块,相同的代码(同是window.open()),为何一个直接打开,另一个直接被拦截?

原因:查资料发现为浏览器的广告拦截功能导致。

补充

1、一般情况下,js中用window.open()新开一个tab页面,浏览器会进行拦截,认为打开的是一个广告页;

2、若将此执行放在用户点击时触发,浏览器会认为是用户想访问这个网页,而并不是你主动弹出给用户;

3、用户点击时触发的函数中,若有多个window.open(),第一个不会被拦截,后面其他的会被拦截;

4、用户点击触发的函数中,若有异步请求,而window.open()放在异步请求的回调函数中,也会被拦截;

解决方法

宗旨——>将其伪装为用户触发的操作

1、使用a标签替代;

给出如下函数,将此函数绑定到click的事件回调中,就可以避免大部分浏览器对窗口弹出的拦截:

function newWin(url, id) {
    var a = document.createElement(‘a‘);
    a.setAttribute(‘href‘, url);
    a.setAttribute(‘target‘, ‘_blank‘);
    a.setAttribute(‘id‘, id);
   // 防止反复添加
   if(!document.getElementById(id)) {
      document.body.appendChild(a);
   }
   a.click();
}

2.使用form的submit方法打开一个页面

这种方法需要构造一个from,然后由js代码触发form的submit,将表单提交到一个新的页面,如:

$("#tijiaos").attr('target', '_blank');
$("#tijiaos").submit();

3.先弹出窗口,再重定向到目标页面

第三种方案,其实是一种变通方案,核心思想是:先通过用户点击打开页面,然后再对页面进行重定向。示例代码如下:

xx.addEventListener(‘click‘, function () {
   // 打开页面,此处最好使用提示页面
   var newWin = window.open(‘loading page‘);

ajax().done(function() {
   // 重定向到目标页面
    newWin.location.href = ‘target url‘;
   });
});

以上方法其实是打开了两个地址,所以建议大家打开第一个地址的时候给出一个类似‘当前页面正在加载中,请稍后。。’的简单提示页,这样可以避免打开两次真正的目标页面,让用户察觉到页面的重定向

扩展

S打开新窗口的2种方式

1.超链接<ahref="http://www.jb51.net" title="脚本之家">Welcome</a>

等效于js代码

window.location.href="http://www.jb51.net";    //在同当前窗口中打开窗口

2.超链接<ahref="http://www.jb51.net" title="脚本之家"target="_blank">Welcome</a>

等效于js代码

window.open("http://www.jb51.net");                //在另外新建窗口中打开窗口

3、关闭新窗口:

this.window.opener =null;

window.close();

window.open()新开网页被拦截的更多相关文章

  1. 解决java新开页面被拦截的问题

    在开发中遇到from表单利用 target="_blank" 属性新开页面时被拦截. 用ajax让form表单提交,这时有可能浏览器会拦截新开页面,这时只 需要设置 ajax 同步 ...

  2. JS判断鼠标进入容器方向的方法和分析window.open新窗口被拦截的问题

    1.鼠标进入容器方向的判定 判断鼠标从哪个方向进入元素容器是一个经常碰到的问题,如何来判断呢?首先想到的是:获取鼠标的位置,然后经过一大堆的if..else逻辑来确定.这样的做法比较繁琐,下面介绍两种 ...

  3. window.open新打开窗口与新开标签页

    最近在使用window.open时忽略了一个细节问题:window.open新打开一个窗口,但是有时却是新打开一个窗口有时打开一个新标签页.虽然对一般的需求来说,这个两种情况都无所谓,但是对于那种有强 ...

  4. ajax回调打开新窗体防止浏览器拦截有效方法

    ajax回调打开新窗体防止浏览器拦截,就这么做! 问题剖析:   1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 function click_fun(){    window ...

  5. webdriver高级应用- 浏览器中新开标签页(Tab)

    #encoding=utf-8 import unittest from selenium import webdriver import time import win32api, win32con ...

  6. WIN7只能上QQ打不开网页,使用CMD输入netsh winsock reset

    此类问题可以用腾讯电脑管家电脑诊所一键修复,请点击上方的[立即修复]即可. 附:手动修复步骤(来源:腾讯电脑管家电脑诊所,自动修复请点击上方的[立即修复])方案一:手动设置DNS(说明:如果您使用DN ...

  7. 从实验室搬到宿舍后可以上QQ但打不开网页

    如果你是属于如标题这种情况:也就是从实验室换到宿舍或者从宿舍换到实验室,在之前的地方可以上网,但换了地方后就出现只能上QQ而不能打开网页的情况.此时,首先考虑DNS配置,很有可能是因为你搬到了宿舍,但 ...

  8. WebView重定向新开界面问题-b

    首先介绍下这个问题,iOS上WebView 如果想更贴近native,就要加载新URL的时候新开个界面,但是如果加载的链接有重定向的话,就会在中间开一个空白的界面,这个好烦.然后就是解决这个问题,采用 ...

  9. 其它网页可以上网,IE浏览器打不开网页的解决办法

    下面是自己引用别人的,作为自己的备注 昨天由于安装了多款软件,今天开机发现IE浏览器打不开了,废了些周折终于,修复了IE浏览器,现将ie浏览器打不开网页的经验分享给大家,希望此经验对于出现过此类情况的 ...

随机推荐

  1. python中logging模块

    1. 日志的等级 DEBUG.INFO.NOTICE.WARNING.ERROR.CRITICAL.ALERT.EMERGENCY 级别 何时使用 DEBUG 详细信息,典型地调试问题时会感兴趣. 详 ...

  2. docker学习-常用命令2

    三.容器管理命令3.1 Docker commit 命令,从容器创建一个新的镜像.OPTIONS说明: -a :提交的镜像作者: -c :使用Dockerfile指令来创建镜像: -m :提交时的说明 ...

  3. springboot+dubbo修改扫描路径引起端口占用的问题

    因为在多模块项目中引入了spring security,消费方(控制层)的工程有两个包,一个controller,一个config.引入之前消费方工程的application.properties中s ...

  4. 浏览器虚拟过程IP插件

    浏览器虚拟过程 这是个插件在调用API时候结合使用,比如调用大量IP去点击http://www.opew.cn和http://www.gtev.cn function QMPlugin.gbip() ...

  5. Jboss项目部署出现java.lang.UnsupportedClassVersionError 问题的解决方法

    出现java.lang.UnsupportedClassVersionError 错误的原因,是因为我们使用高版本的JDK编译的Java class文件试图在较低版本的JVM上运行,所报的错误. 解决 ...

  6. Python学习笔记4基本数据类型续

    start  16:36 时间格式化 程序计时:指测量起止动作所经历的时间的过程 实例四文本进度条 #a表示星号被复制的的次数 文本进度条的动态刷新 实现刷新功能的简单代码,但你会发现并没有实现在同一 ...

  7. python note 16 re模块的使用

    1.re模块(#regex) # 查找 # findall : 匹配所有 每一项都是列表中的一个元素 import re ret = re.findall('\d+','dawdawd154wadwa ...

  8. Dockerfile的alpine时区设置

    FROM *** RUN apk add -U tzdataRUN cp /usr/share/zoneinfo/Asia/Shanghai /etc/localtime

  9. 用7ch中断例程完成jmp near ptr s指令的功能,用bx向中断例程传送转移位移。

    应用举例:在屏幕的第12行,显示data段中以0结尾的字符串. assume cs:code data segment db data ends code segment start: mov ax, ...

  10. Struts2源码解析-----转载

    前面一节描述的Struts2很多东西,这节是对源码进行分析描述,通过这一节应该对struts2有了清楚认识! 还是把Struts2这个框图贴出来: 第一步:HttpServletRequest进入到S ...