标题不知道怎么起合适，其实需求很简单：

黑色背景的容器在页面打开时是隐藏的，点击提交后显示。

然后开始执行递归方法，每次ajax请求完成时，更新容器内容。

在全部执行完成后输出“执行完成”。

submit->download->down。中间download方法是起到封装的作用。

至于为什么不使用$.ajax【async=false】,因为async会造成UI阻塞，结果就是，直到方法完全执行结束才会更新UI，与我们的需求不符合。

睡觉去...具体实现详细童鞋自己看代码吧...

栗子代码：

<html>

<head>

    <title>JQ延迟执行</title>

    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

    <meta name="viewport" content="width=device-width, initial-scale=1.0" />

    <script type="text/javascript" src="/scripts/jquery-1.9..min.js"></script>

</head>

<body>

    <div class="info" style="color:#00ff90;background-color:#000;padding:3px 10px;display:none">执行准备中...</div>

    <input type="button" id="submit" value="提交">

</body>

</html>

<script type="text/javascript">

    $(function () {

        function download(odtd) {

            console.info("开始download方法..");

            console.info("开始设置容器显示..");

            $(".info").show();

            console.info("容器已显示..");

            console.info("开始执行down..");

            var dtd = $.Deferred();

            var promise = dtd.promise();

            down(, dtd);

            promise.done(function () {

                console.error("[应该延时出现]执行完down..");

                console.error("[应该延时出现]执行完download方法..");

                odtd.resolve();//通知上层结束

            });

        }

        function down(index,dtd)

        {

            console.info("开始执行ajax:第[" + (index + ) + "]个");

            if (index < ) {

                $.ajax({

                    url: "/api/user/test"   //每次请求延时5s

                }).done(function (data) {

                    console.info("第[" + (index + ) + "]个ajax完成。开始append");

                    var info = "<p>正在执行第[" + (index + ) + "]个： " + data + "<p>";

                    $(info).appendTo($(".info"));

                    console.info("开始进入下一次的down()");

                    down(++index, dtd);

                });

            }

            else {

                $("<p>执行完成</p>").appendTo($(".info"));

                dtd.resolve();//通知上层结束

            }

        }

        $("#submit").click(function () {

            console.info("submit点击开始执行内部..");

            var odtd = $.Deferred();

            var promise = odtd.promise();

            download(odtd);

            promise.done(function () {

                console.error("[应该延时出现]submit内部执行完download之后..");

                console.error("[应该延时出现]我应该最后出现..");

            });

            console.error("[应该延时出现]错误的延时演示..");

        });

    });

</script>

在递归函数中使用JQuery.Deferred，异步请求中的同步执行...的更多相关文章

  1. javascript 异步请求封装成同步请求

    此方法是异步请求封装成同步请求,加上token验证,环境试用微信小程序,可以修改文件中的ajax,进行封装自己的,比如用axios等 成功码采用标准的 200 到 300 和304 ,需要可以自行修改 ...

  2. springboot 中如何正确在异步线程中使用request

    起因: 有后端同事反馈在异步线程中获取了request中的参数,然后下一个请求是get请求的话,发现会偶尔出现参数丢失的问题. 示例代码: @GetMapping("/getParams&q ...

  3. 利用 Jquery Deferred 异步你的程序

    最近在做公司QA系统改造时,有这样的一个场景. QA系统中有些数据项需要从JIRA平台(一个国外项目与事务跟踪工具)中获取,JIRA平台提供了很完善的Rest API. 现在的要求是,在QA系统中提交 ...

  4. php中使用fsockopen实现异步请求

    php执行一段程序,有可能几毫秒就执行完毕,也有可能耗时较长.例如,用户下单这个事件,如果调用了些第三方服务进行发邮件.短信.推送等通知,可能导致前端一直在等待.而有的时候,我们并不关心这些耗时脚本的 ...

  5. jquery Ajax异步请求之session

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

  6. jQuery Ajax(异步请求)

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

  7. 异步请求中jetty处理ServletRequestListener的坑

    标题起得比较诡异,其实并不是坑,而是jetty似乎压根就没做对异步request的ServletRequestListener的特殊处理,如果文中有错误欢迎提出,可能自己有所疏漏了. 之前遇到了一个b ...

  8. 微信小程序中使用Async-await方法异步请求变为同步请求

    微信小程序中有些 Api 是异步的,无法直接进行同步处理.例如:wx.request.wx.showToast.wx.showLoading等.如果需要同步处理,可以使用如下方法: 注意: Async ...

  9. WeChat-SmallProgram：微信小程序中使用Async-await方法异步请求变为同步请求

    微信小程序中有些 Api 是异步的,无法直接进行同步处理.例如:wx.request.wx.showToast.wx.showLoading 等.如果需要同步处理,可以使用如下方法: 提示:Async ...

  10. ASP.NET MVC 中使用 jQuery 实现异步搜索功能

    常见的几种异步请求方式: Ajax.BeginForm   异步提交文本的形式 Ajax.ActionLinkk 文本链接的形式 Client Validataion  客户端的认证 一.用jQuer ...

随机推荐

  1. linux中的strings命令

     strings - print the strings of printable characters in files.            意思是, 打印文件中可打印的字符.  我来补充一下吧 ...

  2. sourceTree 代码冲突解决

    1.代码提交,有冲突 2. 拉取未同步的代码,勾选用衍合代替合并. 3. 在工作副本,未提交代码显示 4. 冲突代码解决 5. sourcetree页面

  3. 利用phpspider爬取网站数据

    本文实例原址:PHPspider爬虫10分钟快速教程 在我们的工作中可能会涉及到要到其它网站去进行数据爬取的情况,我们这里使用phpspider这个插件来进行功能实现. 1.首先,我们需要php环境, ...

  4. tee命令使用

    需求描述: 今天在看nginx内容的过程,遇到了tee这个命令,所以查询了下,在这里记录下使用方法. 操作过程: 1.执行以下的命令 [root@testvm ~]# uname -n | tee h ...

  5. linux install Openvino

    recommend centos7 github Openvino tooltiks 1. download openvino addational installation for ncs2 ncs ...

  6. CSS3之calc()和box-sizing属性

    box-sizing 属性 规定两个并排的带边框的框: 例子: box-sizing 属性允许您以特定的方式定义匹配某个区域的特定元素. 例如,假如您需要并排放置两个带边框的框,可通过将 box-si ...

  7. Java调用dll动态库

    最近项目里使用java调用dll动态库,因此研究了一下这方面的东西. 使用的工具包如下 <dependency> <groupId>net.java.dev.jna</g ...

  8. objectarx 把当前图形输出

    方法1: AcDbDatabase *pdb; acdbCurDwg()->wblock(pdb); pdb->saveAs(str); pdb->closeInput(true); ...

  9. cuda cudnn tensorflow-gpu安装

    Ububtu18.04下载cuda9.0 下载好后得到: CUDA 9.0仅支持GCC 6.0及以下版本,而Ubuntu 18.04预装GCC版本为7.3,需要安装gcc-6与g++-6 查看当前版本 ...

  10. IP包设计

    IP包 IP核(Intellectual Property core)就是知识产权核或知识产权模块的意思,用于配置FPGA或其它硅芯片上的逻辑资源. 引用链接https://blog.csdn.net ...