在Ajax回调函数中请求以window.open()的方式请求新页面会被拦截

项目中的应用场景是点击用户姓名,如果用户存在打开新窗口展示用户详情页面,如果用户在详情页面被删除,再次点用户姓名弹框提示此用户已被删除;代码写好后测试时发现打开新页面请求被浏览器拦截。代码如下:

handle_show_customer_info: function(customer_id){
$.ajax({
url: "/customer_management/customers/" + customer_id + "/exist",
type: "POST",
success: function (data) {
if(data == 'exist'){
window.open("/customer_management/customers/" + customer_id + '/edit')
}
else{
$("#deleted_customer").modal('show')
}
},
error: function () {}
})
}

以上代码是点击用户姓名时调用ajax方法,当ajax成功回调返回exist后打开新页面,否则弹框提示,这种情况下页面是被拦截的。

解决方案:把ajax方法的async属性值设置为false,如下:

handle_show_customer_info: function(customer_id){
$.ajax({
url: "/customer_management/customers/" + customer_id + "/exist",
type: "POST",
async: false,
success: function (data) {
if(data == 'exist'){
window.open("/customer_management/customers/" + customer_id + '/edit')
}
else{
$("#deleted_customer").modal('show')
}
},
error: function () {}
})
}

这样请求新页面的时候是正常的

这个ajax请求则为同步请求,用户其它操作必须等待请求完成才可以执行。
如果async设置为:true,则不会等待ajax请求返回的结果,会直接执行ajax后面的语句。

注:为什么请求会被浏览器拦截原因还没找到

你可能感兴趣的:(javascript)