在实际使用中,我们经常会用的Ajax(异步加载,在不刷新整个网页的前提下对网页部分内容进行更新)

使用时,偶尔会遇上需要从一个接口中得到一个数组和数据对应的id,在另一个接口上再得到数据,最初写法如下:

$.get(url_1, function (data) {
var dom = [];
for (var i = 0; i < data.length; i++) {
var item = data[i]; //两个url不一致,根据id查找另一个表
$.get(url_2, function (data) {
var item_result = data;
dom.push("<div> item_result.id</div>");
}); }
$("#id").empty().append(dom.join(''));
});

但是此时经常会出现数组清空后并没有写入数据的问题,初学时常误以为时接口错误的问题,其实不然

这是由于$get()等Ajax方法在调用接口时需要时间,导致push还未完成已经发生了append的行为,即此时数组清空,但是dom数组中此时并没有join读取的数据

故此处需要将循环中的Ajax修改为同步,代码修改如下:

$.get(url_1, function (data) {
var dom = [];
for (var i = 0; i < data.length; i++) {
var item = data[i]; //在第二次的Ajax前将异步改同步
$.ajaxSettings.async = false; //两个url不一致,根据id查找另一个表
$.get(url_2, function (data) {
var item_result = data;
dom.push("<div> item_result.id</div>");
}); //注意在ajax中的push完成后,将其改回异步
$.ajaxSettings.async = true; }
$("#id").empty().append(dom.join(''));
});

jQuery Ajax(异步改同步)的更多相关文章

  1. jquery ajax异步和同步从后天取值

    最近使用jquery的ajax,发现有些效果不对,ajax请求后返回的json串回来了,但是执行顺序有问题. var isReload = false; $.post('/home/DetectCac ...

  2. 使用 jQuery Ajax 异步登录,并验证用户输入信息(maven)

    使用 jQuery Ajax 异步登录,并验证用户输入信息(maven) 本篇内容: (1)上一篇是使用同步的请求实现登录,并由 Servlet 决定登陆后下一步做哪些事情,本篇使用 jQuery A ...

  3. Jquery Ajax 异步设置Table中某列的值

    可根据table中某列中的ID去改变某列的值! 只是参考,实际应用中不能这样做的,如果有很多行,频繁访问服务器,服务器是顶不住的! JS: $(document).ready(function () ...

  4. jquery ajax属性async(同步异步)示例

    在jquery的ajax中如果我们希望实现同步或者异步我们可以直接设置async发生为真或假即可true false,下面举几个jquery ajax同步和异步实例 例1.jquery+ajax/&q ...

  5. JQuery $.ajax(); 异步访问完整参数

    $.ajax 完整参数   jquery中的ajax方法参数 url: 要求为String类型的参数,(默认为当前页地址)发送请求的地址. type: 要求为String类型的参数,请求方式(post ...

  6. jquery Ajax异步请求之session

    写了一个脚本,如下: $(function () { $("#btnVcode").click(function () { var receiveMobile = $(" ...

  7. jQuery Ajax(异步请求)

    jQuery异步请求 原始的异步请求是需要创建的 XMLHttpRequest 对象.(IE5,6不支持)目前很多浏览器都支持XMLHttpRequest对象 jQuery ajax常用的回调函数:b ...

  8. jquery ajax异步调用

    写程序的第一步都要知其然,至于知其所以然就要看个人的爱好了.下面说一下web开发中经常用的ajax. 这里是用的jquery框架实现的ajax异步调用.废话少说先上代码.(asp.net开发) var ...

  9. jquery.ajax异步发送请求的简单测试

    使用ajax异步发送请求到一般处理程序,判断输入的用户名和密码 1.添加Html页面,导入jquery 2.编写js代码和页面标签 <script type="text/javascr ...

随机推荐

  1. 在 MVC 中使用 ninject Lazy Load的一个想法

    这这里先声明一下,引用了一个 (http://www.edcourtenay.co.uk/musings-of-an-idiot/2012/11/23/lazy-binding-with-ninjec ...

  2. JAVA Web从前端到后台常用框架介绍

    原博客:https://blog.csdn.net/u013142781/article/details/50922010 一.SpringMVC http://blog.csdn.net/evank ...

  3. MacOs桌面自动被打乱的原因

    1 系统设置--Mission Control -- 自动根据最近使用情况排序的勾勾去掉

  4. python学习,day2:列表的复制

    主要涉及列表的潜复制(第二层受后面修改的影响)和深复制(不受后面修改的影响) 代码如下 # coding=utf-8 # Author: RyAn Bi import copy names = ['A ...

  5. C++_类和动态内存分配5-使用指向对象的指针

    再探new和delete new为创建的每一个对象的名称字符串分配存储空间,这是在构造函数中进行的: 析构函数使用delete来释放这些内存. 字符串是一个字符数组,所以析构函数使用的是带中括号的de ...

  6. P1613 跑路

    Luogu1613 #include<bits/stdc++.h> using namespace std; const int N=65; bool G[N][N][N]; int di ...

  7. json语法和使用

    一.JSON 概述: JavaScript Object Natation,是一种轻量级的数据交换技术规范. 二.使用流程: 在服务端将java对象转换为JSON,然后发送到浏览器,在浏览器上在讲JS ...

  8. 洛谷 P2482 loj #2885 [SDOI2010]猪国杀 题解【模拟】【贪心】【搜索】

    好玩的模拟题. 以后要经常写模拟题鸭 题目描述 游戏背景 <猪国杀>是一种多猪牌类回合制游戏,一共有\(3\)种角色:主猪,忠猪,反猪.每局游戏主猪有且只有\(1\)只,忠猪和反猪可以有多 ...

  9. 组合数取模介绍----Lucas定理介绍

    转载https://www.cnblogs.com/fzl194/p/9095177.html 组合数取模方法总结(Lucas定理介绍) 1.当n,m都很小的时候可以利用杨辉三角直接求. C(n,m) ...

  10. U盘安装CentOS 7错误 /dev/root does not exist, could not

    问题: U盘安装CentOS 7,显示/dev/root does not exist, could not boot 解决方法: 1. 到windows里面查看U盘名称(例如 "Cento ...