就我们做知,ajax强大之处在于它的异步请求,但是有时候我们需要ajax执行彻底完成之后再执行其他函数或操作

这个时候往往我们用到ajax的回调函数,但是假如你不想或者不能把接下来的操作写在回调函数中,怎么办?

以jquery.page.js插件为例,分页初始化如下:

$(".tcdPageCode").createPage({
pageCount:100,
current:1,
backFn:function(p){
//console.log(p);
}
});

这里pageCount总页数我需要从后台动态获取,也就是需要ajax请求接口后返回的值

一开始我把分页初始化的这段代码写在ajax的回调函数中

function getRecourcesAction(result) {
if (result != null) {
$(".tcdPageCode").createPage({
pageCount: result.pageCount,
current: nowPage,
backFn: function (p) {
pageNo=p-1;
nowPage=p;
getRecources(getRecourcesAction);
}
});
var html = template('recources', {
list: result.data
});
$("#recource li").remove();
$("#recource").append(html);
}
else {
layer.open({
title: '提示',
content: "资源查询失败!"
});
}
}

因为backFn中会继续请求,所以会重复创建,上一页、下一页翻页时会出现连续跳页的情况,最后超出总页数而溢出出错

解决办法:

设置全局变量pageCount,先进行ajax请求,得到返回的总页数后赋值给pageCount,然后再进行初始化分页。注意:ajax请求时,设置async: false(默认为true),进行同步请求,即Ajax请求将整个浏览器锁死,只有请求结束后才能执行其他操作,否则pageCount值还未返回就先初始化分页了。

$(function(){
getRecources(getRecourcesAction); //初始化页面(资源初始化) //初始化分页
$(".tcdPageCode").createPage({
pageCount: pageCount,
current: nowPage,
backFn: function (p) {
pageNo=p-1;
nowPage=p;
getRecources(getRecourcesAction);
}
});
});

ajax请求执行完成后再执行其他操作(jQuery.page.js插件使用为例)的更多相关文章

  1. 用一个bat文件调用另外两个bat文件,当1.bat执行完后再执行2.bat

    用一个bat文件调用另外两个bat文件,当1.bat执行完后再执行2.bat 摘自:https://zhidao.baidu.com/question/492732911.html @echo off ...

  2. C# 本进程执行完毕后再执行下一线程

    最近做了一套MES集成系统,由上料到成品使自动化运行,其中生产过程是逐步的,但是每一个动作都需要独立的线程进行数据监听,那么就需要实现线程等待. 代码: using System; using Sys ...

  3. iOS AFNetWorking中block执行完后再执行其它操作

    需求:同时进行两次网络请求,网络请求是异步的,在网络请求成功后进行其它的操作.两个网络请求是这样,一个网络请求中block执行完之后,再进行其它操作,也是一样的原理,只是这时候不需要线程组了,只需要信 ...

  4. vue在一个方法执行完后再执行另一个方法

    vue在一个方法执行完后执行另一个方法 用Promise来实现.Promise是ES6的新特性,用于处理异步操作逻辑,用过给Promise添加then和catch函数,处理成功和失败的情况 ES7中新 ...

  5. Java主线程在子线程执行完毕后再执行

    一.join() Thread中的join()方法就是同步,它使得线程之间由并行执行变为串行执行. public class MyJoinTest { public static void main( ...

  6. 使用Promise发送多个异步请求, 全部完成后再执行

    const datas = idList .map(id => url+'/id') .map(url => fetch(url).then(res => res.json())); ...

  7. ES6(Promise)等一个函数执行完后再执行另一个函数

    function text1(){ return new Promise((resolve, reject) => { setTimeout(function () { resolve(cons ...

  8. C# 多线程join的用法,等待多个子线程结束后再执行主线程

    等待多个子线程结束后再执行主线程 class MultiThread{ #region join test public void MultiThreadTest() { Thread[] ths = ...

  9. angularjs中如何在异步请求执行完以后再执行其他函数?

    angularjs中如何在异步请求执行完以后再执行其他函数? 之前脑袋回路就是从上到下的执行js,直到有一次我的页面上已经显示了空才走到angularjs里的$http的成功回调函数里,然后才开始正视 ...

随机推荐

  1. wpf Datagrid 的全选

    在我的一个datagrid的一列中需要全选框,所以我在样式中是这样写的: <DataGridTemplateColumn.Header> <CheckBox> <i:In ...

  2. 正则表达式&nbsp;LINUX

    正则表达式 热身 正则表达式(regular expression)描述了一种字符串匹配的模式,可以用来检查一个串是否含有某种子串.将匹配的子串做替换或者从某个串中取出符合某个条件的子串等. 例如 g ...

  3. windows64位如何安装pyspider并运行

    1.下载whl文件: http://www.lfd.uci.edu/~gohlke/pythonlibs/#lxml 2.安装该文件 3.可能碰到问题,pip的版本低了,需要更新一下pip的版本.更新 ...

  4. C# 写 LeetCode easy #7 Reverse Integer

    7.Reverse Integer Given a 32-bit signed integer, reverse digits of an integer. Example 1: Input: 123 ...

  5. 将Date转换成 yyyy-MM-dd 格式的字符串

    // 方法1 原型Date.prototype.format = function (format) {    var o = {        "M+": this.getMon ...

  6. int **指针问题

    转自:http://blog.csdn.net/u012501459/article/details/45395571 在打印二维数组时遇到了问题,二维数组可以这样定义int matrix[ROWS] ...

  7. cf808D(xjb)

    题目链接:http://codeforces.com/problemset/problem/808/D 题意:问能不能通过交换不超过两个元素的位置使得原数组变成能分成前,后和相等的连续两部分: 注意这 ...

  8. 洛谷P1654 产品排序(sort)

    P1654 产品排序(sort) 题目描述 有一系列产品,给定每个产品的加工时间和冷却成型时间(冷却过程产品之间没有关系,是单独冷却的).现在你手上有两台机器可以用来加工,你需要安排产品加工的顺序以及 ...

  9. codevs 3333 高级打字机

    3333 高级打字机   题目描述 Description 早苗入手了最新的高级打字机.最新款自然有着与以往不同的功能,那就是它具备撤销功能,厉害吧. 请为这种高级打字机设计一个程序,支持如下3种操作 ...

  10. 解决Idea项目启动报错:程序包javax.servlet.http不存在

    报错信息 在没有使用maven的时候,web项目从远程仓库获取下以后,起一次启动往往会报错javax.servlet.http程序包找不到,随之而来的java基础包都将不能使用,报错信息如下: 解决方 ...