用JQUERY的deferred异步按顺序调用后端API

花了两天啊,想办法。

顺便,DJANGO分页的东东也熟悉了下。

如果不用最新的deferred这个东东,那我们以前传统的链式异步调用代码很难看,且长。

以下这个东东未作优化代码封装。

this的参数用非VAR呈现全局调用。

且加了AJAX的前处理及结束处理。让网页为用户呈现升级信息。

var _self = this;

            promiseA = $.ajax({
                url:‘{% url "cp-dir" %}‘,
                type: ‘post‘,
                data:{
                     tgt : tgt,

                },
                dataType: ‘json‘,
                beforeSend: function(){
                    $(_self).attr(‘disabled‘,"true");
                    $(_self).append(" <i class=‘uk-icon-cog uk-icon-spin‘></i>");
                },
                   error: function(){
                    alert(‘Error loading json document‘);
                },
                success: function(json){
                    UIkit.notify("cp-dir", {status:‘info‘, timeout:1000});
                    var json = eval(json);
                     $.each(json, function (index, item) {
                         UIkit.notify(json[index], {status:‘info‘, timeout:1000});

                     });
                }
            });

            promiseB = promiseA.then(function(){
                return $.ajax({
                    url:‘{% url "AUTO_DEPLOY:cmd-run" %}‘,
                    type: ‘post‘,
                    data:{
                         tgt : tgt,

                    },
                    dataType: ‘json‘,
                    error: function(){
                        alert(‘Error loading json document‘);
                    },
                    success: function(json){
                        UIkit.notify("cmd-run", {status:‘info‘, timeout:1000});
                        var json = eval(json);
                         $.each(json, function (index, item) {
                             UIkit.notify(json[index], {status:‘info‘, timeout:1000});
                         });

                    },
                    complete: function(){
                        $(_self).children(‘i‘).remove();
                        $(_self).append(" <i class=‘uk-icon-check‘></i>")
                    }
                });
            });
时间: 2024-10-14 16:03:25

用JQUERY的deferred异步按顺序调用后端API的相关文章

jquery的deferred异步

推荐方法: var wait = function(dtd){ var dtd = $.Deferred(); //在函数内部,新建一个Deferred对象 var tasks = function(){ alert("执行完毕!"); dtd.resolve(); // 改变Deferred对象的执行状态 }; setTimeout(tasks,5000); return dtd.promise(); // 返回promise对象 }; $.when(wait()) .done(fu

Jquery中的异步编程浅析 延期(deferred)的承诺(promise)

引子 相信各位developers对js中的异步概念不会陌生,异步操作后的逻辑由回调函数来执行,回调函数(callback function)顾名思义就是"回头调用的函数",函数体事先已定义好,在未来的某个时候由某个事件触发调用,而这个时机,是程序本身无法控制的. 举几个常见例子: 事件绑定 动画 Ajax 上面的例子简单.典型,易于阅读和理解. 为了引出本文的主题,假设现在有3个ajax异步操作,分别为A.B.C,每个都封装成了函数,并可传入success回调作为参数. 请考虑以下场

触碰jQuery:AJAX异步详解

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

jQuery之Deferred对象

Deferred对象是由$.Deferred构造的,$.Deferred被实现为简单工厂模式. 它用来解决JS中的异步编程,它遵循 Common Promise/A 规范.实现此规范的还有 when.js 和 dojo. $.Deferred作为新特性首次出现在版本1.5中,这个版本利用Deferred又完全重写了Ajax模块. $.Deferred在jQuery代码自身四处被使用,分别是promise方法.DOM ready.Ajax模块.动画模块. 这里以版本1.8.3分析,由于1.7后$.

触碰jQuery:AJAX异步详解(转)

AJAX 全称 Asynchronous JavaScript and XML(异步的 JavaScript 和 XML).它并非一种新的技术,而是以下几种原有技术的结合体. 1)   使用CSS和XHTML来表示. 2)   使用DOM模型来交互和动态显示. 3)   使用XMLHttpRequest来和服务器进行异步通信. 4)   使用javascript来绑定和调用. 通过AJAX异步技术,可以在客户端脚本与web服务器交互数据的过程中使用XMLHttpRequest对象来完成HTTP请

jQuery的deferred对象详解(二)

Deferred对象是由$.Deferred构造的,$.Deferred被实现为简单的工厂模式. $.Deferred的实现 创建三个$.Callbacks对象,分别表示成功done,失败fail,处理中process三种状态 对应了三种处理结果,resolve.reject.notify 创建了一个promise对象,具有state.always.then.primise方法 通过扩展primise对象生成最终的Deferred对象,是阻止其他代码来改变这个deferred对象的状态,defe

谈谈JQuery的Deferred对象

最近一个变态的项目,一个页面只含编辑器且有下载功能,大概含20个左右接口,要求数据完整显示(很多echarts图),弄个等待圈圈等它loading,启用jQuery的Deferred延迟对象,再多的接口也不怕了.(之前没有用过Deferred对象,姑且谈谈吧) $.ajax(),低于1.5.0版本的jQuery,返回的是XHR对象,高于1.5.0版本jQuery,返回的是Deferred对象. $.when(),when通常执行0个或多个异步事件的Deferred延迟对象的回调函数: 当参数为多

[译文]jQuery的Deferred

?? jQuery的$.Deferred()命令是该函数库中近来最强大的命令.它并非是一个新观念,但对于数以千计的前端开发人员来说是极有价值的.从核心来看,Deferred非常的简单,但却是一个很强大的异步管理的工具.众所周知开发前端时,经常需要进行异步的处理. ?? 我们把焦点放在Deferred以及jQuery在这方面所提供的API.下面有许多丰富的范例.读完后,你将会了解到什么是Deferred以及何时使用它. 了解核心概念 ?? Deferred本质上就是一个Proxy对象,它可以套用到

jquery的Deferred 对象初体验

之前阅读了阮一峰老师的jQuery的deferred对象详解一文,结合jquery手册,算是对Deferred对象有了初步的认知.今天便来分享一下我自己的一些体会. 一.deferred可以方便的添加回调 先来看下面的例子 1 var test = function(callback) { 2 setTimeout(function() { 3 console.log('我完成了'); 4 callback('我是回调') 5 }, 1000) 6 }; 7 test(function(text