`
shadowlin
  • 浏览: 47219 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

异步模式下的Ajax的同步问题

阅读更多
   虽然Ajax可以设置为同步或者异步模式,但是在某些情况下(比如用jsonp实现ajax跨域调用)只能让Ajax工作在异步模式下。但是很多时候异步模式会带来一些编程上的麻烦,所以我写了个用于同步异步ajax的函数,在这里和大家分享下希望对有相同需求的朋友有所帮助,也请大家提下建议和意见。
/**
 * Ajax同步函数
 * @param ajaxCompleteFlagCallback 用于判断Ajax调用是否完成的回调函数
 * @param synchronizedCallback 和ajax同步的函数
 * @return
 */
function ajaxSynchronizer(ajaxCompleteFlagCallback,synchronizedCallback){
	var intervalId=null;
	function waitAjaxCompleteFlag(){
		if(ajaxCompleteFlagCallback()){
			synchronizedCallback();
			clearInterval(intervalId);
			intervalId=null;
		}
	}
	if(!ajaxCompleteFlagCallback()){
		intervalId=setInterval(waitAjaxCompleteFlag,150);
	}else{
		synchronizedCallback();
	}
}


函数的参数是两个回调函数,一个是用来判断ajax是否完成(可以通过在ajax的回调函数中设置一个完成标志来实现),一个是需要和ajax同步的函数。
分享到:
评论
2 楼 shadowlin 2010-03-31  
Relucent 写道
其实这个和异步同步问题无关。
你只是成功之后调用某个方法。其实还是异步的ajax,而且写得复杂了。

Ajax本身是有有同步的调用方法的,可以直接用。

另外你的 if(!ajaxCompleteFlagCallback()){  多个个括号


你注意看下我前面说的话,如果你用jsonp来跨域调用的话是不能设置成同步模式的(jquery的ajax函数,不知道是为什么,如果有人知道希望能告知一下)。
我的标题也是写的《异步模式下的ajax的同步问题》。
另外,你说我多个括号的地方你可以仔细看看,是没有多的。
不过管怎么说,谢谢关注这个帖子:)
1 楼 Relucent 2010-03-31  
其实这个和异步同步问题无关。
你只是成功之后调用某个方法。其实还是异步的ajax,而且写得复杂了。

Ajax本身是有有同步的调用方法的,可以直接用。

另外你的 if(!ajaxCompleteFlagCallback()){  多个个括号

相关推荐

    AJAX同步或异步流程图

    AJAX(Asynchronous JavaScript and XML)是一种在无需重新加载整个网页的情况下,能够更新部分网页的技术。它通过在后台与服务器交换...理解并熟练运用AJAX的同步和异步模式,是提升Web应用性能和交互性的重要手段。

    浅谈js的ajax的异步和同步请求的问题

    实现Ajax同步请求的方式是通过设置`async`属性为`false`。在jQuery中,可以通过AJAX调用的选项中设置`async: false`来达到这一目的。然而,需要注意的是,在实际开发中,推荐使用异步模式,因为同步模式会阻塞浏览器...

    关于解决jquery同步异步的问题

    需要注意的是,在异步模式下,由于`alert(a);`语句会在`$.ajax()`请求完成之前被执行,因此`a`的值始终为1;而在同步模式下,`alert(a);`将会在`$.ajax()`完成后执行,此时`a`已经更新为服务器返回的数据。 #### ...

    Ajax页面局部异步刷新技术

    ### Ajax页面局部异步刷新技术 ...此外,还需要注意编码、请求方式、同步/异步模式的选择等因素对请求的影响。在实际开发中,开发者可以根据具体需求灵活运用这些知识点,构建高效、流畅的Web应用。

    extjs3.0 ajax 同步请求

    ### ExtJS 3.0 AJAX 同步请求详解 #### 一、引言 ...随着技术的发展,现代前端框架如 React、Vue 等已经很少使用同步 AJAX 请求,取而代之的是更高效的异步编程模式,如 Promise 和 async/await。

    Ajax同步和异步问题浅析及解决方法

    在文档中提出了两种解决Ajax同步异步问题的方法: 1. 回调函数解决方案: 这种方法是在Ajax请求成功完成后,通过回调函数来执行依赖于异步数据返回的操作。例如,在文档提供的代码片段中: ```javascript $.get...

    同步执行和异步执行学习Demo

    了解和熟练掌握同步执行与异步执行的概念及其在不同场景下的应用,对于编写高效、响应迅速的程序至关重要。通过实践和学习Demo,可以更好地理解和运用这些原理,提升编程技能。在"学习demo"这个压缩包中,可能包含了...

    ajax 同步和异步XMLHTTP代码分析

    总结来说,理解AJAX的同步和异步模式是至关重要的,它们直接影响到应用程序的性能和用户体验。在开发过程中,要根据具体场景选择合适的工作模式,并充分利用回调函数来处理服务器的响应。同时,了解不同浏览器对...

    AJAX访问PHP函数库AJASON的同步(非异步)版

    在异步模式下,AJAX请求发送后不会阻塞代码执行,而是在服务器响应后通过回调函数来处理结果。而在同步模式下,JavaScript会等待服务器的响应,直到收到数据后才会继续执行后面的代码,这就像传统的函数调用,确保了...

    ajax异步提交表单

    AJAX(Asynchronous JavaScript and XML)是一种在无需重新加载整个网页的情况下,能够更新部分网页的技术。通过在后台与服务器进行少量数据交换,AJAX可以使网页实现异步更新。这可以极大地提升用户体验,尤其是在...

    尚筹网-加餐-Ajax的同步和异步请求1

    在异步模式下,Ajax请求发送后,浏览器不会等待服务器的响应,而是继续执行后续的代码。当服务器返回响应时,会调用预设的回调函数。 **1.2 代码** 以下是一个使用jQuery库的Ajax异步请求示例: ```javascript $....

    Spring MVC异步模式

    而在异步模式下,服务器接收请求后不会立即返回结果,而是启动一个后台线程去处理,主线程则可以继续服务其他请求,当后台任务完成后,再通知客户端获取结果。 实现Spring MVC异步模式的关键在于`@Async`注解。这个...

    jquery ajax 同步异步的执行 return值不能取得的解决方案

    通过将AJAX请求设置为同步模式,即在$.ajax()方法中设置async为false,这样可以确保AJAX请求在函数返回之前完成。代码示例如下: ```javascript function getAjaxReturn() { var bol = false; $.ajax({ type: ...

    Ajax设计模式 中文

    《Ajax设计模式》这本书深入探讨了这些挑战,并提出了一系列的设计模式来解决这些问题。 ### 1. 数据管道模式 此模式用于在Ajax请求和数据处理之间建立一个中间层,确保数据在到达视图之前经过必要的转换和验证,...

    程序同步与异步的区别

    - **异步(AJAX技术)**: AJAX(Asynchronous JavaScript and XML)技术允许在不重新加载整个页面的情况下更新部分网页内容。用户可以在等待服务器响应的同时继续与其他部分互动,从而提高了用户体验。 3. **日常...

    Java EE应用中的异步通信技术AJAX.rar

    10. **异步与同步模式**:Ajax请求可以设置为异步或同步,默认是异步。同步模式会导致浏览器阻塞,直到请求完成,因此通常避免使用。 11. **JSONP(JSON with Padding)**:对于不支持CORS的旧版浏览器,JSONP是一...

    $.getJSON同步异步问题1

    总结起来,解决$.getJSON异步请求导致的数据混乱问题,可以采用设置`$.ajaxSettings.async = false`来强制同步执行,但需谨慎使用,并在完成后恢复为异步模式。在实际开发中,更推荐使用Promise或者async/await等...

    ajax异步笔记

    - **同步交互**:在传统的网页交互模式下,当客户端向服务器端发送请求时,整个过程会阻塞用户的其他操作,即用户必须等待服务器响应完成才能继续进行其他活动。这种方式用户体验较差,特别是在网络条件不佳的情况下...

    详解socket阻塞与非阻塞,同步与异步、I/O模型

    相反,异步模式下,客户端发起请求后,不需要等待结果,可以继续执行其他任务,服务端处理完成后再通过回调或通知方式将结果返回给客户端,如同使用Ajax进行后台请求,浏览器可以继续处理其他用户交互。 阻塞与非...

Global site tag (gtag.js) - Google Analytics