最近做了一个项目,在项目中涉及到先向后端发送ajax请求,根据ajax返回的结果来觉得是否跳转。刚开始我是这样做的。代码如下:
提交的表单:
<form action="" method="post" id="rtbForm" target="_blank"> <input type="hidden" id="_merchantCode" name="merchantCode" value="${merchantCode}"/> <input type="hidden" id="_outOrderId" name="outOrderId" value="${outOrderId}"/> </form>执行的js脚本:
$.ajax({ type : 'post', url : "<%=path%>/pay/pay.do", data : { payChannel:payChannel, bankCode: bankCode, merchantCode: merchantCode, outOrderId: outOrderId }, cache : false, success : function(data) { if(data.success) { $("#rtbForm").attr("src",data.message); $("#rtbForm").submit(); $("#turnBank").modal("show"); }else { if("页面已失效"==data.message) { error_alert("页面已失效,请刷新或返回上一页"); }else{ error_alert(data.message); } } }, error : function(){ error_alert("网络异常,请重新支付"); } });
当ajax执行成功,我提交“rtbForm"表单的时候,新标签页面被浏览器拦截了。测试了各种内核的浏览器也是一样的。后来在网上搜了半天找到了一种方法,把ajax提交改为同步的,就是加async=false;代码如下:
$.ajax({ type : 'post', url : "<%=path%>/pay/pay.do", data : { payChannel:payChannel, bankCode: bankCode, merchantCode: merchantCode, outOrderId: outOrderId }, cache : false, async:false,//同步 success : function(data) { if(data.success) { $("#rtbForm").attr("src",data.message); $("#rtbForm").submit(); $("#turnBank").modal("show"); }else { if("页面已失效"==data.message) { error_alert("页面已失效,请刷新或返回上一页"); }else{ error_alert(data.message); } } }, error : function(){ error_alert("网络异常,请重新支付"); } });
后来自己尝试了在提交ajax请求之前,我先用window.open打开一个新标签,然后再我异步请求成功后改变标签地址这种方法。代码如下:
var newWin = window.open("<%=path%>/pay/wait.do", "_blank"); $.ajax({ type : 'post', url : "<%=path%>/pay/onpay.do", data : { payChannel:payChannel, bankOrgCode: bankOrgCode, merchantCode: merchantCode, outOrderId: outOrderId }, cache : false, success : function(data) { if(data.success) { newWin.location.href = "<%=path%>/"+data.message+"?merchantCode=${merchantCode}&outOrderId=${outOrderId}"; $("#turnBank").modal("show"); }else { if("页面已失效"==data.message) { error_alert("页面已失效,请刷新或返回上一页"); }else{ error_alert(data.message); } newWin.close();//关闭新标签 } }, error : function(){ error_alert("网络异常,请重新支付"); newWin.close();//关闭新标签 } }); }