场景描述

如下,打开页面时,获取默认选中的项目,同时也会初始化Combobox下拉框下拉列表数据

问题描述

获取默认选中项目及下拉列表的js函数位于common.js文件,类似如下:

// 根据项目类型,获取对应的项目

function getProjects(projectType) {

// 请求已有已启用项目

$.get('/action/getProjects?projectType=' + projectType, function(data,status) {

var jsonData = JSON.parse(data);

return jsonData;

});

}

js函数调用代码位于另一个html文件--testTaskManager.html,<script></script>元素标签内。

如下

// 初始化项目combobox下拉列表

var jsonData = getProjects('TestProject');

console.log(jsonData);

if (jsonData['result'] == 'success') {

$('#projects').combobox('loadData', jsonData['data']);

} else {

$.messager.alert('错误信息', '获取项目失败:' + jsonData['data'], 'error');

}

结果打开页面时,控制台提示如下:

原因很简单,

var jsonData = getProjects('TestProject');

以上代码getProjects函数调用,会引发get请求。

紧接着,开始执行后续的代码,涉及到jsonData的引用,但是此时,请求可能还没返回结果,也就是说getProjects 还没返回数据给jsonData,jsonData未定义。

解决方案

让这两个文件中的代码“同步”运行。

function getProjects(projectType) {

var defer = $.Deferred(); //返回Deferred对象;

// 请求已有已启用项目

$.get('/action/getProjects?projectType=' + projectType, function(data,status) {

var jsonData = JSON.parse(data);

defer.resolve(jsonData);

});

return defer;

}

// 初始化项目combobox下拉列表

getProjects('TestProject').then(function(jsonData) {

if (jsonData['result'] == 'success') {

$('#projects').combobox('loadData', jsonData['data']);

} else {

$.messager.alert('错误信息', '获取项目失败:' + jsonData['data'], 'error');

}

});

说明

以上代码,大致意思就是先指定getProjects函数的的异步操作,执行完成后才执行then函数中指定的回调函数。

done(fn)

fail(fn)

then(done, fail)

done, fail这两个方法都用来绑定回调函数fn,fn可能是一个function,也有可能是多个以逗号分隔的function函数。

resolve(arg)

这个方法用来改变deferred对象的状态为resolved, 并告诉deferred对象执行done回调,arg是传递给回调函数的参数。

reject(arg)

这个方法用来改变deferred对象的状态为rejected,并告诉deferred对象执行done回调,arg是传递给回调函数的参数。

JQuery Deferred对象使用小结的更多相关文章

  1. javascript --- jQuery --- Deferred对象

    javascript --- jQuery --- Deferred对象 javascript的函数式编程是多么引人入胜,jQuery使代码尽可能的精简,intelligent! defer - 必应 ...

  2. JQuery Deferred 对象

    http://www.ruanyifeng.com/blog/2011/08/a_detailed_explanation_of_jquery_deferred_object.html <jQu ...

  3. jQuery.Deferred对象

    一.前言 jQuery1.5之前,如果需要多次Ajax操作,我们一般会使用下面的两种方式: 1).串行调用Ajax $.ajax({ success: function() { $.ajax({ su ...

  4. JQuery Deferred 对象剖析

    JQuery 中利用 Deferred 对象提供类似 ES2016(aka. es7) 中 Promise 的功能. JQuery 中的 AJAX 请求函数返回的就是 Deferred 对象. 通过使 ...

  5. 使用JQuery Deferred对象的then() 解决多个AJAX操作顺序依赖的问题

    原文地址:http://www.2cto.com/kf/201507/424202.html 之前的文章javascript异步代码的回调地狱中提到了编写AJAX代码经常遇到的3个问题,现在我们看下如 ...

  6. jQuery Deferred对象详细源码分析(-)

    本系列文章讲介绍这个Deferred东西到底拿来干什么,从1.5版本加进来,jQuery的很多代码都重写了.直接先上源码分析了,清楚了源码分析,下节将讲具体的应用 以及应用场景. 创建对象 var d ...

  7. 知识笔记:jQuery 事件对象属性小结

    使用事件自然少不了事件对象.因为不同浏览器之间事件对象的获取,以及事件对象的属性都有差异,导致我们很难跨浏览器使用事件对象.jQuery中统一了事件对象,当绑定事件处理函数时,会将jQuery格式化后 ...

  8. jquery 事件对象属性小结

    使用事件自然少不了事件对象. 因为不同浏览器之间事件对象的获取, 以及事件对象的属性都有差异, 导致我们很难跨浏览器使用事件对象. jQuery中统一了事件对象, 当绑定事件处理函数时, 会将jQue ...

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

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

随机推荐

  1. c++-面向对象:类和对象

    类和对象 #define _CRT_SECURE_NO_WARNINGS #include <iostream> #include <string.h> using names ...

  2. 利用Azure虚拟机安装Dynamics 365 Customer Engagement之十二:新增SQL Server可用性副本

    我是微软Dynamics 365 & Power Platform方面的工程师罗勇,也是2015年7月到2018年6月连续三年Dynamics CRM/Business Solutions方面 ...

  3. mysql-5.7.21-winx64安装教程

    1 . 下载对用的版本信息 地址是:https://dev.mysql.com/downloads/mysql/ 2 . 解压到目录 D:\tools\mysql\mysql-5.7.21-winx6 ...

  4. 形如 T(n) = a * T(n/b) + f(n) 的时间复杂度计算方法

    形如 T(n) = a * T(n/b) + f(n) 的时间复杂度计算方法 有一种方法叫做主方法(Master method)是用来专门计算这种形式的时间复杂度的,方法具体如下: 下边举例进行说明: ...

  5. IOC、DI、DIP

    OCP: 开闭原则  对修改关闭  对扩展开放 1.面向对象主要做俩件事:实例化对象和调用方法(完成业务逻辑) 2.单纯interface可以统一方法的调用,但是不能统一对象的实例化 3.只有一段代码 ...

  6. cpv framework 0.1 正式发布 (C++ 网页框架)

    项目地址 https://github.com/cpv-project/cpv-framework 项目介绍 cpv framework 是一个 C++ 编写的网页框架,基于 seastar fram ...

  7. SpringCloud服务过滤filter

    一.目录展示 二.application.yml配置文件 三.MyZuulFilter package com.zn.filter; import com.netflix.zuul.ZuulFilte ...

  8. Python 学习笔记(基础篇)

    背景:今年开始搞 Data science ,学了 python 小半年,但一直没时间整理整理.这篇文章很基础,就是根据廖雪峰的 python 教程 整理了一下基础知识,再加上自己的一些拓展,方便自己 ...

  9. Java8新特性之接口defualt,static方法

    简介 作用 Java8中接口引入了defualt,static两种方法提供默认实现,彻底打破了接口不能有默认实现的规定 static 让接口类似于工具类,提供一些静态方法 static方法不会被子类继 ...

  10. Git介绍与简易搭建

    Git介绍 Git(读音为/gɪt/.)是一个开源的分布式版本控制系统,可以有效.高速的处理从很小到非常大的项目版本管理. Git 是 Linus Torvalds 为了帮助管理 Linux 内核开发 ...