当前位置:首页 > Web开发 > 正文

点击执行效果如下: debug调试有数据: 以上就是异步和同步ajax请求的区别

2024-03-31 Web开发

$.getJSON是jQuery请求get处事的一种方法,请求告成后返回json数据。

请求格局为:$.getJSON(url,data,function(result){...});

url:请求路径;

data:请求参数;

function函数:请求告成后执行的代码。

  *$.getJSON请求分异步同步两种方法,需要区分差此外使用场景!!!

1.$.getJSON异步请求(默认情况都是异步的):

$.getJSON("http://localhost/WCFService/FOnwipRes.svc/GetDMDXDeviceList", {"OrgId":118}, function(data){ var data = eval("(" + data + ")"); var DMDXData = eval("(" + data.Data + ")"); )};

但是,有时候这种方法并不成行~~

例如,在点击事件中,点击触发后发送请求,再把返回的数据进行措置惩罚惩罚。会呈现请求未响应完成,后面的代码已经在对请求功效进行措置惩罚惩罚,呈现东西不决义的异常。

代码演示:

弹出框使用的是layer.js来实现

//触发点击事件,弹出信息 function getDMDXInfo(e) { var DMDXDataNew = ""; //json返回数据
var DMDX =""; //需要弹出的内容
$.getJSON("http://localhost/WCFService/FOnwipRes.svc/GetMouldDMDXList", {"OrgId":118}, function(data){ var data = eval("(" + data + ")"); DMDXDataNew = eval("("+data.Data+")"); }); //此处省略一万行(╯﹏╰)~~~~~~~~~~~~~~~~~~~~~
//DMDXDataNew颠末措置惩罚惩罚得到DMDX
if(DMDX == ""){ layer.alert(‘没有数据‘,{ title:DeviceName }); }else{ layer.alert(DMDX,{ title:DeviceName }); } }

我们此刻浏览器中访谒接口,功效是有返回数据的,如下图:

技术图片

点击执行效果如下:

技术图片

接口明明是返回数据的,弹出框确提示没有,Why?

debug调试呈现异常:data is not defined,这是因为ajax在请求处事还没有完成,又异步执行了下面的代码,,而此时data还没有数据,故呈现is not defined错误。

技术图片

如何解决这种问题呢?我们只需要把异步请求改为同步请求~~

2.$getJSON同步请求

代码演示:

//触发点击事件,弹出信息 function getDMDXInfo(e) { var DMDXDataNew = ""; //json返回数据
var DMDX = ""; //需要弹出的内容
$.ajaxSettings.async = false; //设为同步请求 $.getJSON("http://localhost/WCFService/FOnwipRes.svc/GetMouldDMDXList", {"OrgId":118}, function(data){ var data = eval("(" + data + ")"); DMDXDataNew = eval("("+data.Data+")"); }); $.ajaxSettings.async = true; //设为异步请求

在ajax请求开始前将请求设为同步请求 $.ajaxSettings.async = false
在ajax请求结束后不要忘了将请求设备异步请求,否则其他的ajax请求也都酿成了同步请求
$.ajaxSettings.async = true

点击执行效果如下:

技术图片

debug调试有数据:

技术图片

以上就是异步和同步ajax请求的区别,事情时需注意区分两种请求方法的使用场景。

 写在最后~~

温馨提示: 本文由Jm博客推荐,转载请保留链接: https://www.jmwww.net/file/web/32387.html