异步请求后在浏览器中打开窗口
背景
在开发的过程中,我们经常会遇到这样的情景,点击某个元素,发送异步请求(ajax或者jsonp),根据返回的结果新开窗口打开链接。刚开始觉得实现这个需求很简单,只要在返回结果后直接用window.open去打开链接。可是,在实践的过程中,却发现这种方式会被浏览器拦截。正常的情况下 点击一个元素 用window.open打开一个新的网页没有问题,但是异步请求后再用window.open会被拦截,这是浏览器的一种安全策略。
解决方案
既然浏览器在异步请求前能够打开窗口,那么我们通过在异步请求前打开一个中间页面(可以设计为一个加载中的页面),然后根据异步请求后的结果,重新对新打开的窗口做指向,具体实现如下
<a href="javascript:void(0)">点击跳转</a>
$('a').click(function(){ var temp = window.open('_bank'); $.ajax({ url: 'url', type: 'get', dataType: 'jsonp', success: function(rs){ temp.location.href = 'http://baidu.com'; }, timeout: 4000 }) })
在ie8+,firefox,chrome测试有效