关于jquery的$.ajax发接口的同步与异步问题

1.在使用$.ajax发接口时想对返回数据做一些处理后拿到其他方法中使用

  发请求函数如下:

function getProjectName(projectId){
        project.projectName = [];
        $.ajax({
            type: conf.GET,
            url: conf.API_qryProjectList+"?projectId="+projectId,
            dataType: "JSON"
        }).done(function(data)
            console.log("执行getprijectName的done");
        });
    }

  使用时代码如下:

function qryTaskInfo(projectId) {
        $.ajax({
            type: conf.GET,
            url: conf.API_qryTaskList+"?myTaskFlag="+projectId+"&userId="+conf.userId,
            dataType: "JSON"
        }).done(function(data) {
            project.taskList = data.taskList;

            var taskList = project.taskList;
            var projectArrays = [];
            var projectIdArrays = [];
            for(var i = 0; i < taskList.length; i++) {
                projectId = taskList[i].projectId;
                if (!isContainProjectId(projectIdArrays, projectId)) {
                    var projectObject = {"projectId": projectId + ""};
                    projectIdArrays.push(projectObject);
                    console.log("调用getProjectName");
                    getProjectName(projectId);
                    console.log("调用getUserByProjectId");
                    getUserByProjectId(projectId);
                    console.log(project.projectName);
                    console.log(project.projectUsers);
                    console.log("-----------");
                    var pName = {"projectName": project.projectName+""};
                    var pUsers = {"projectUsers": project.projectUsers+""};
                    projectIdArrays.push(pName);
                    projectIdArrays.push(pUsers);
                    console.log(pName);
                    console.log(pUsers);
                }
            }
            console.log("huhx projectids: " + projectIdArrays);
            var hasFinish = 0, hasComplete = 0, total = 0,projectName,users;
            for(var i = 0; i < projectIdArrays.length; i++) {
                for(var j = 0; j < taskList.length; j++) {
                    if (projectIdArrays[i].projectId == taskList[j].projectId) {
                        total ++;
                        if (taskList[j].status == "1") {
                            hasFinish++;
                        } else if (taskList[j].status == "3") {
                            hasComplete++;
                        }
                        projectIdArrays[i].hasFinish = hasFinish;
                        projectIdArrays[i].hasComplete = hasComplete;
                        projectIdArrays[i].total = total;
                    }
                }
                projectArrays.push(projectIdArrays[i]);
            }
            console.log("huhx arrays: " + projectArrays);
            projectList=projectArrays;
            //console.log(data);
        });
    }

  执行结果:

  问题:

    在接口已发送和接口返回数据这段时间内执行了其他js代码,导致我在done中做的处理都没及时生效。

  解决方法:

    在请求参数中添加async:false,设置为同步发送请求。

 添加之后控制台:

时间: 2024-08-04 21:16:59

关于jquery的$.ajax发接口的同步与异步问题的相关文章

js中请求数据的$post和$ajax区别(同步和异步问题)

$.post和$.Ajax都为页面上向后台发送请求,请求数据 1.post 因为post默认为异步请求,可是有时候我们会发现,本来要求请求马上出现,可是异步会导致后面突然再执行,这样就出很多问题 2.Ajax 最原始的Ajax,可以控制同步或者异步,属性:async设置为false,代表同步:async设置为true,代表异步 语法如下: $.ajax({ type : "post", url : "register/RegisterState", data : &

jquery的ajax同步和异步

之前一直在写JQUERY代码的时候遇到AJAX加载数据都需要考虑代码运行顺序问题.最近的项目用了到AJAX同步.这个同步的意思是当JS代码加载到当前AJAX的时候会把页面里所有的代码停止加载,页面出去假死状态,当这个AJAX执行完毕后才会继续运行其他代码页面假死状态解除. 而异步则这个AJAX代码运行中的时候其他代码一样可以运行. jquery的async:false,这个属性 默认是true:异步,false:同步. $.ajax({ type: "post", url: "

JQuery 之 Ajax 异步和同步浅谈

Ajax 同步和异步的区别 同步是当 JS 代码加载到当前 Ajax 的时候会把页面里所有的代码停止加载,页面出现假死状态:当这个 Ajax 执行完毕后才会继续运行其他代码此时页面假死状态才会解除.反之异步则 Ajax 代码在运行时,其余的 JS 脚本依旧能够运行. 在 Jquery 中可以通过 async 的 true 和 false 设置同步或异步,在默认的情况下是为 true 即为异步. 接下来请看下 Sample Code: $.ajax({ type: "post", url

jquery的ajax同步和异步的理解及示例

之前一直在写JQUERY代码的时候遇到AJAX加载数据都需要考虑代码运行顺序问题.最近的项目用了到AJAX同步.这个同步的意思是当JS代码加载到当前AJAX的时候会把页面里所有的代码停止加载,页面出去假死状态,当这个AJAX执行完毕后才会继续运行其他代码页面假死状态解除. 而异步则这个AJAX代码运行中的时候其他代码一样可以运行. jquery的async:false,这个属性 默认是true:异步,false:同步. 复制代码代码如下: $.ajax({ type: "post", 

jQuery中ajax的同步与异步

之前一直在写JQUERY代码的时候遇到AJAX加载数据都需要考虑代码运行顺序问题.最近的项目用了到AJAX同步.这个同步的意思是当JS代码加载到当前AJAX的时候会把页面里所有的代码停止加载,页面出去假死状态,当这个AJAX执行完毕后才会继续运行其他代码页面假死状态解除. 而异步则这个AJAX代码运行中的时候其他代码一样可以运行. jquery的async:false,这个属性 默认是true:异步,false:同步. $.ajax({ type: "post", url: "

jQuery的ajax async同步和异步介绍

项目中有这样一个需求,使用ajax加载数据返回页面并赋值,然后前端取出该值 这其中涉及到代码的顺序问题,有时后台还未返回数据,但已执行后面代码, 所以就会造成取不到值 $.ajax({ type: "post", url: "admin/PfmOptionRuleItem.do", success: function(data){ $("#ruleItem").val(data.ruleItem); //① } }); return $(&quo

关于Jquery中ajax介绍

jQuery 底层 AJAX 实现.简单易用的高层实现见 $.get, $.post 等.$.ajax() 返回其创建的 XMLHttpRequest 对象.大多数情况下你无需直接操作该函数,除非你需要操作不常用的选项,以获得更多的灵活性. 回调函数 在我们使用的时候,如果要处理$.ajax()得到的数据,则需要使用回调函数. beforeSend 在发送请求之前调用,并且传入一个XMLHttpRequest作为参数. error 在请求出错时调用.传入XMLHttpRequest对象,描述错误

触碰jQuery:AJAX异步详解

触碰jQuery:AJAX异步详解 传送门:异步编程系列目录…… 示例源码:触碰jQuery:AJAX异步详解.rar AJAX 全称 Asynchronous JavaScript and XML(异步的 JavaScript 和 XML).它并非一种新的技术,而是以下几种原有技术的结合体. 1)   使用CSS和XHTML来表示. 2)   使用DOM模型来交互和动态显示. 3)   使用XMLHttpRequest来和服务器进行异步通信. 4)   使用javascript来绑定和调用.

用jQuery的Ajax调用WCF服务编程心得

这两天在写基于WCF服务的后台框架,过程中遇到了一些挫折,经过努力全部解决了,在此分享给大家,使用的工具是Visual Studio 2013. 该后台需要支持通过json来传递和接收数据. 首先,说说搭建过程. 第一步:创建WCF服务应用程序项目WCF. 第二步,创建服务使用的数据类 using System; using System.ComponentModel.DataAnnotations; using System.ComponentModel.DataAnnotations.Sch