使用window.open打开新窗口被浏览器拦截的解决方案

问题描述:

代码中直接使用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

上一篇:Nunit工具做C#的单元测试


下一篇:spring中注解式事务不生效的问题