100字范文,内容丰富有趣,生活中的好帮手!
100字范文 > ajax同步请求与异步请求 Ajax请求的同步与异步

ajax同步请求与异步请求 Ajax请求的同步与异步

时间:2022-07-05 01:35:52

相关推荐

ajax同步请求与异步请求 Ajax请求的同步与异步

在写一个项目时遇到一个问题。

问题是这样的,点击切换到A TAB页时,需要通过ajax加载数据,然后用highchart图表进行显示。由于数据加载较多,要等待上几秒,所以打算加个loading的样式,使用户体验良好。

使用了模态框的形式,载入一张loading的gif图片。

$(".tab").click(function(){

$("loadingModal").modal("show");

执行ajax1;

执行ajax2;

})

本来以为按照预想的显示,但是实际上,只在ajax2请求完之后才短暂地显示了模态框。

后来查资料后,才发现其中的问题,

由于设计需要,两个ajax请求都设为同步。

即,async:false;(true的话即为异步)

如果ajax请求设为同步,则在发送ajax请求后,页面会出现假死,无法与用户交互,直到ajax请求完毕后网页才会恢复。也就是问题中,为什么等到ajax2执行完毕之后,我的模态框才弹出loading样式。

如果async:true,则为异步请求。发送ajax后,不用等待请求完毕,便可继续执行以下的操作。

由于设计需要,ajax必须为同步,但是如何在同步状态下显示loading字样,还需要继续想办法

后来为了完成该需求还是做了一些解决方法。

查资料后发现,当我们ajax请求设置为同步的时候,UI绘制线程会被挂起,主线程用于通过ajax读取数据。知道ajax返回数据后UI线程才能恢复工作状态。

我的解决方法还是绕不过这个点。只能变通,需要互相依赖的ajax就让他们先后执行。比如,Bajax需要从Aajax中获得数据再请求,那么就将Bajax的执行放在Aajax的success函数中。

虽然实际上没有解决ui线程与主线程的问题,但在一定程度上还是绕过了这个坑。至于这个怎么解决,等待再次查资料

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。