问题描述:

代码中直接使用window.open('//www.baidu.com', '_blank');会被浏览器窗口拦截

原因
浏览器为了维护用户安全和体验,在JS中直接使用window.open(url,"_blank")来打开新的链接是会被拦截的。
通常项目需要在ajax异步请求完成后来打开新链接,下面提供几种解决方案

解决方案

1.最常用的在ajax异步请求成功后打开新窗口


//先在ajax函数之前打开新窗口后再加载url
$('#btn').click(function () {
// 打开页面,此处最好使用提示页面
var newWin = window.open();
newWin.document.body.innerHTML="正在加载中......";
$.ajax({
url: 'www.###.com',
success: function (url) {
// 重定向到目标页面
newWin.location.href = url;
}
})
});

2.利用a标签跳转,能解决大多数浏览器兼容问题,但是这种方不适用于ajax异步请求回调中打开新窗口,在ajax异步请求完成后调用无效(用户点击事件触发)


function newWin(url){ //新窗口打开
var a = document.createElement('a');
a.setAttribute('href', url);
a.setAttribute('style', 'display:none');
a.setAttribute('target', '_blank');
document.body.appendChild(a);
a.click();
a.parentNode.removeChild(a);
};
document.body.addEventListener('click', function() {
newWin('http://www.baidu.com');
});

原文地址:https://segmentfault.com/a/1190000016717630

使用window.open打开新窗口被浏览器拦截的解决方案的更多相关文章

  1. window.open打开新窗口被浏览器拦截的处理方法

    一般我们在打开页面的时候, 最常用的就是用<a>标签,如果是新窗口打开就价格target="_blank"属性就可以了, 如果只是刷新当前页面就用window.loca ...

  2. Flash打开新窗口 被浏览器拦截问题 navigateToURL被拦截 真正试验结果

    众所周知,打开新窗口以前经常被用作弹出广告用,而随着浏览器发展,现在估计除了ie6之外,基本都有广告拦截功能,最基本就是拦截这种非人为的弹出新窗口.我对js研究不深,我所了解就是,必须是用户操作的处理 ...

  3. Ajax提交打开新窗口,浏览器拦截处理

    //主要是添加同步处理 $.ajax({ url: "ashx/OrderHander.ashx?action=CheckRepeat", data: { "OrderI ...

  4. Ajax提交打开新窗口,浏览器拦截处理;以及跨域问题

    //主要是添加同步处理 $.ajax({ url: "ashx/OrderHander.ashx?action=CheckRepeat", data: { "OrderI ...

  5. ajax请求响应中用window.open打开新窗口会被浏览器拦截的解决方式

    一.问题描述 ajax 异步请求成功后需要新开窗口打开 url,使用的是 window.open() 方法,但是会被浏览器给拦截了,需要用户点下. 二.问题分析 浏览器之所以拦截新开窗口是因为该操作并 ...

  6. 几个主流浏览器 Window.open打开新窗口 、模拟a标签打开新窗口的 表现

    Window.open打开新窗口 1.常用浏览器打开新窗口(正常打开window.open)的的不同表现形式(PC/移动端) 2.Window.open在异步处理中打开(_blank) a标签在异步处 ...

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

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

  8. window.open打开新窗口 参数

    1,基本描述 oNewWindow = window.open( sURL , sName , sFeatures, bReplace) window.open在打开一个窗口(其url为sURL)后, ...

  9. js 模拟window.open 打开新窗口

    为什么要去模拟window.open() 打开一个 新的窗口呢,因为有些浏览器默认会拦截 window.open, 当需要函数中打开新窗口时,接可以使用a标签去模拟打开. /** * a模拟windo ...

随机推荐

  1. .NET Core 跨平台物联网开发:连接阿里云IOT(一)

    系列教程目录 (一) 连接阿里云IOT (二) 设置委托事件 (三) 上报属性 (四)  SDK文档 属性.方法.委托.类 http://pan.whuanle.cn/index.php?dir=up ...

  2. 如何使用go打出hell word

    今天给大家带来一篇如何使用go打出hell word(手动滑稽) 关于go介绍的话,我就不多说了,在百度上一搜一大堆, 要使用的软件Visual Studio Code(VScode) 下载go的地址 ...

  3. 洛谷 P2759 奇怪的函数

    https://www.luogu.org/problemnew/show/P2759 #include<cstdio> #include<algorithm> #includ ...

  4. 线段树+扫描线 HDOJ 5091 Beam Cannon(大炮)

    题目链接 题意: 给出若干个点的坐标,用一个W*H的矩形去覆盖,问最多能覆盖几个点. 思路: 这是2014上海全国邀请赛的题目,以前写过,重新学习扫描线.首先把所有点移到第一象限([0, 40000] ...

  5. 第05课 Linux命令初探(一)

    该篇为第一部分,主要介绍的Linux指令有: mkdir.cd.ls.rm.touch.vi/vim.echo.cat.cp.mv.pwd.rm.rmdir 1.创建一个目录/data 提示:Wind ...

  6. OC的单例模式

    原文: http://www.galloway.me.uk/tutorials/singleton-classes/ 在iOS开发中,单例是最有用的设计模式之一.它是在代码间共享数据而不需要手动传递参 ...

  7. 如何修改phpmyadmin上传文件大小限制

    修改php配置文件,php.ini upload_max_filesize = 100M post_max_size = 100M 一般修改这2个就行了,然后重启wampserver 如果还不行,就执 ...

  8. 微信环境支付宝服务窗环境app手机浏览器pc端混合判断

    //微信环境 if(userAgent.match(/micromessenger/) == 'micromessenger'){ }//支付宝服务窗环境else if(userAgent.match ...

  9. [转]java注解与APT技术

    下面是一个简单的自定义注解的栗子: package annotation; import java.lang.annotation.Documented; import java.lang.annot ...

  10. CocoaPods安装遇到的坑。

    //官方推荐地址 CocoaPods :http://code4app.com/article/cocoapods-install-usage cooped的安装  $(inherited) 报pod ...