用jquery的ajax方法获取不到return返回值

今天给别人调bug,遇到了jquery的ajax方法获取不到return返回值这个问题。
两个错误写法会导致这种情况:
1.ajax未用同步 
2.在ajax方法中直接return返回值。
html部分

js部分

    $(function () {
        var html="";
        html+="
我是一个div"+fn()+"
"; function fn() { var htmls=""; $.ajax({ type:"get", url:"../tsconfig.json", dataType:"json", async:false, //同步 success:function (data) { $.each(data,function (index,item) { htmls+="
"+item.cname+"
"; }); } }); return htmls; } $('.box1').append(html); })

解释下:
1、ajax未用同步
ajax异步请求,决定了fn方法之中的代码会比后续代码后执行,所以return就变得无意义了。
如果在参数中,将请求设置为了同步,那么从代码执行顺序上,是满足了返回值这样一个条件(先执行fn方法中的代码,再执行后续),但是由于fn/success是一个函数,由于js中每个函数都会有自己的作用域,所以,产生了跨作用域的返回,导致我们上层函数不能直接接受fn的返回值。不过由于ajax请求每次都会执行complete,所以这个的返回值是能接受到的。

1是异步,2是作用域。、首先异步,决定了done之中的代码可能会比后续代码后执行,所以return就变得无意义了。

如果在参数中,将请求设置为了同步,那么从代码执行顺序上,是满足了返回值这样一个条件(先执行done中的代码,再执行后续),但是由于done/success是一个函数,由于js中每个函数都会有自己的作用域,所以,产生了跨作用域的返回,导致我们上层函数不能直接接受done的返回值。不过由于ajax请求每次都会执行complete,所以这个的返回值是能接受到的。

2.在ajax方法中直接return返回值。
如果在参数中,将请求设置为了同步,那么从代码执行顺序上,是满足了返回值这样一个条件(先执行done中的代码,再执行后续),但是由于done/success是一个函数,由于js中每个函数都会有自己的作用域,所以,产生了跨作用域的返回,导致我们上层函数不能直接接受done的返回值。不过由于ajax请求每次都会执行complete,所以这个的返回值是能接受到的。
可以这样:定一个局部变量 把data赋值给局部变量 然后 return 局部变量即可 。
3.总结
所有的异步加载的过程return都不好使,例如 ajax的异步加载过程,点击事件的异步加载和定时器的异步加载。

你可能感兴趣的:(jQuery)