问题描述:
代码中直接使用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');
});