业务场景:点击一个按钮的时候保存数据,同时打开一个弹窗带出保存的数据
基于这样的业务场景,最近遇到一个问题,是在ie11才发现的,点击按钮时候,后台打断点加数据库查询都验证数据是保存正确的,不过已经保存的数据是带不到弹窗页面的,问题比较奇怪,排查了挺长时间,最开始因为在ie才能重现的问题,在极速模式的360浏览器是没问题的,而且第一次点击时候没带出数据,第二次点击时候才可以带出数据,然后很容易让人联想到ie的缓存问题,不过调了大半天
加上ajax不缓存的代码,已经改成post请求,或者get请求连接后面加上一个时间戳参数都不奏效
$(function(){
//ajax不缓存请求结果
$.ajaxSetup({cache: false});
});
然后经过和同事沟通,才发现自己跟错了方向,经过检查发现保存的方法是用异步的,问题就出现在这里了,首先验证是不是由于异步导致的,在保存数据代码和打开弹窗页面的代码之间加一个alert提示,发现果然,关联alert弹窗提示之后,数据正常带出,所以确定是因为异步导致的
保存的代码,注意async:true,
,这里是异步的,之前可能是考虑性能问题,改成异步的
$.ajax({
url:'${root}/saveOrUpdate.do',
type:"post",
async:true,
success:function(result){
...
}
});
所以经过一番调试,给出自己的方案,解决方法是用回调函数:
保存函数:
function saveRecord(seq,callback){
$.ajax({
url:'${root}/saveOrUpdate.do',
type:"post",
async:true,
success:function(result){
if(callback!=undefined){
callback(true);
}
}
});
}
//保存成功,才会打开弹窗
function main(seq){
saveRecord(seq,callbackFunction);
}
/*保存时的回调函数*/
function callbackFunction(saveSuccess){
if(saveSuccess){
//省略打开弹窗代码
}
}