在Ajax请求中以_blank方式请求新的页面会被拦截

最新推荐文章于 2023-01-19 08:00:00 发布

CoCo__Luo

最新推荐文章于 2023-01-19 08:00:00 发布

阅读量1k

点赞数

<html>
	<head>
		<title>Test for ajax</title>
		<script type="text/javascript" src="jquery.js"></script>
	</head>
	<body>
		<h1>Index Page</h1>
		<a href="#" id="button">提交</a>
		<script type="text/javascript">
			$("#button").click( function() {
				$.ajax({
					url : "#", //url为校验用户信息的方法
					async : true,
					success : function() {
						window.open("http://www.baidu.com");//window.open效果等于target='_blank'
						return false;
					}
				});
				return false;
			})
		</script>
	</body>
</html>

说明：代码如上所示，当点击“提交” button时，调用ajax方法，当ajax返回成功响应后打开http://www.baidu.com，但是结果却是页面被浏览器拦截，如下图所示：

页面被拦截

方法一：把ajax方法的async属性值设置为false，如下：

 
$.ajax({
url : "#", //url为校验用户信息的方法
async : false, //同步属性设为false
success : function() {
window.open("http://www.baidu.com");//window.open效果等于target='_blank'
return false;
}
});

这样，再次测试后就能正常打开新的页面了。

注：为什么会被浏览器拦截还没找到原因，估计是处于安全考虑。

不过根据w3cschool所述，一般是不推荐使用 async=false，JavaScript 会等到服务器响应就绪才继续执行。如果服务器繁忙或缓慢，应用程序会挂起或停止。具体参见：AJAX - 向服务器发送请求

方法二：

<input type="button" class="preview" value="预览"/>
$('.preview').live('click', function(){
　　var w = window.open();//发请求之前打开一个空页面
　　$.ajax({..., success:function(msg){
　　　　setTimeout(function(){w.location='http://www.baidu.com';}, 0);//0秒后给新窗口的localtion赋值
　　}});
});