前几天做项目多次用到了Ajax,有的时候一个js函数中要调用几次,每次都去写一大段麻烦的很,我就想为什么不去把Ajax调用的过程封装一下,把参数和链接传进去,然后把返回值传给调用函数来处理呢。想到我就去做了,写了这个个函数:
可是我每次运行的时候都提示If(html.result == “success”)有错误,html为空,我单步跟踪了一下,jsonAjax方法也执行了。我就很郁闷,就请同事测试了一下。发现他那边一会行一会不行。
感觉单步跟踪不能真实的测试出到底发生了什么,然后我就用alert测试了一下。
再次运行先是alert了一个”undefined”,接着又alert了一个object
仔细想了一下ajax调用应该是浏览器又开的一个线程,所以在获得html的时候一会可以拿到,一会拿不到。
然后就把函数重新设计了一下:
顺利执行成功。
虽然在封装ajax方法过程中遇见了些许困难,浪费了一些时间,但是还是挺值的。明白了两点:
第一, js是支持多线程的。
第二, ajax是多线程实现的,不能等待它的返回值(让主线程sleep也不太好),因为它不一定什么时候执行。
/**
* ajax提交
* @param url
* @param param
* @param callback回调函数
* @return
*/
function jsonAjax(url, param) {
alert(url);
$.ajax({
type:"POST",
url:url,
data:param,
dataType:"json",
success:function(html){
return html;
},
error:function(){
return {result:”error”};
}
});
}
测试:var html = jsonAjax(url, param);
If(html.result == “success”)
…
可是我每次运行的时候都提示If(html.result == “success”)有错误,html为空,我单步跟踪了一下,jsonAjax方法也执行了。我就很郁闷,就请同事测试了一下。发现他那边一会行一会不行。
感觉单步跟踪不能真实的测试出到底发生了什么,然后我就用alert测试了一下。
/**
* ajax提交
* @param url
* @param param
* @param callback回调函数
* @return
*/
function jsonAjax(url, param) {
alert(url);
$.ajax({
type:"POST",
url:url,
data:param,
dataType:"json",
success:function(html){
alert(html);
return html;
},
error:function(){
return {result:”error”};
}
});
}
测试:var html = jsonAjax(url, param);
Alert(html);
If(html.result == “success”)
再次运行先是alert了一个”undefined”,接着又alert了一个object
仔细想了一下ajax调用应该是浏览器又开的一个线程,所以在获得html的时候一会可以拿到,一会拿不到。
然后就把函数重新设计了一下:
/**
* ajax提交
* @param url
* @param param
* @param callback回调函数
* @return
*/
function jsonAjax(url, param, callback) {
alert(url);
$.ajax({
type:"POST",
url:url,
data:param,
dataType:"json",
success:callback,
error:function(){
jQuery.fn.mBox( {
message :'恢复失败'
});
}
});
}
顺利执行成功。
虽然在封装ajax方法过程中遇见了些许困难,浪费了一些时间,但是还是挺值的。明白了两点:
第一, js是支持多线程的。
第二, ajax是多线程实现的,不能等待它的返回值(让主线程sleep也不太好),因为它不一定什么时候执行。