ajax多次请求，只执行最后一次的方法
ajax多次请求，只执行最后一次的方法
有时候点击按钮进行异步请求数据的时候可能网络差，用户会点击很多次，或者页面有很多相同的按钮，参数不同，但是调用的ajax相同，只想得到最后一次结果
我的思路是用闭包记录执行次数，并同时记录发起ajax的次数，等数据返回的时候比较两次次数的结果，渲染最后一次数据
多说无益，上代码
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"/>
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="renderer" content="webkit"> <script src="http://code.jquery.com/jquery-2.1.1.min.js"></script>
<title>Title</title>
</head>
<body>
<button id="ajaxbtn">获取数据</button>
点击次数<span id="num"></span>
<div id="show"> </div> <script>
//定义点击次数和方法执行次数
var a = 1;
var flag = 1;
$('#ajaxbtn').click(function () {
a = a + 1
$('#num').html(a)
console.log(a);
btnAjax('https://api.douban.com/v2/movie/in_theaters', cb);
})
//封装ajax事件
function btnAjax(url, cb) { $.ajax({
type: 'get',
url: url,
dataType: 'jsonp',
success: function (data) {
var func = callbackFunc(data, cb);
func()
}
})
}
//返回函数
function cb(data) {
console.log(a);
console.log(data);
var str = '';
for (var i = 0; i < data.subjects.length; i++) {
str += '<img src="' + data.subjects[i].images.small + '">';
}
$('#show').html(str)
}
//判断次数，获取返回函数
function callbackFunc(data, cb) {
flag++;
if (a == flag) {
return function () {
cb(data);
}
} else {
return function () {
}
}
}
</script>
</body>
</html>
ajax多次请求，只执行最后一次的方法的更多相关文章
- 利用闭包实现多次ajax请求只执行最后一次
点一个按钮,则向服务器请求资源,不作处理时,多次点击后会有很多个请求在等待.我们知道一般我们用ajax是异步请求,那么我们快速重复点击一个按钮得到的结果其实我们并不知道是哪次点击的结果可能是第一次可能 ...
- ajax 载入html后不能执行其中的js解决方法
事件背景 有一个公用页面需要在多个页面调用,其中涉及到部分js已经写在了公用页面中,通过ajax加载该页面后无法执行其中的js. 解决思路 1. 采用附加一个iframe的方法去执行js,为我等代码洁 ...
- Ajax中Delete请求参数 后台无法获取的解决方法（Restful风格）
方法一: 在ajax中写入data来传参时,直接把参数拼接到url后面 例如: $.ajax({ url: '/cyberspace/vrv/event/delete/1002?startTime=& ...
- js闭包for循环总是只执行最后一个值得解决方法
<style> li{ list-style: none;width:40px;height: 40px;text-align:center;line-height: 40px;curso ...
- 解决ajax跨域请求 （总结）
ajax跨域请求,目前已用几种方法实现: 1)用原生js的xhr对象实现. var url="http://freegeoip.net/json/" ...
- legend2---开发日志10（ajax请求的方法是否同样会执行base控制器里面的方法）
legend2---开发日志10(ajax请求的方法是否同样会执行base控制器里面的方法) 一.总结 一句话总结:会执行的,所以写base控制器里面的方法要注意,base控制器里面的方法要以查数据为 ...
- 详解Ajax请求（四）——多个异步请求的执行顺序
首先提出一个问题:点击页面上一个按钮发送两个ajax请求,其中一个请求会不会等待另一个请求执行完毕之后再执行? 答案是:不会,这两个异步请求会同时发送,至于执行的快与慢,要看响应的数据量的大小及后台逻 ...
- ajax请求完成执行的操作
var createAjax = $("#createId").ajax(function(){ //ajax操作 }); $.when(createAjax).done(func ...
- layui表单提交使用form.on('submit(sub)',function (){}) 使用ajax请求时回调不执行的原因及解决方法
ayui使用官方的表单模块form.on('submit(sub)',function (){}) 提交,使用ajax请求向后台请求一个执行结果,根据结果进行处理,出现回调无法执行,并且页面出现了刷新 ...
随机推荐
- Markdown语法收录
引言 Markdown编辑模式的写法在写博客以及生成简单的页面都有一定的使用,这里只收录Markdown的一些语法供以后查阅使用.具体使用手册可详见Markdown 语法说明(简体中文版) 正文 段落 ...
- linux系统端口查看和占用的解决方案
使用netstat命令查看端口占用情况 netstat -tln 查看什么程序占用端口 netstat -tlnp 过滤端口 netstat -tlnp |grep 8080 杀掉进程 kill - ...
- 每天一个linux命令(53)--ps命令
要毁掉一天,从早上开始. Linux中的ps命令是 process status 的缩写.ps 命令用来列出系统中当前运行的那些进程.ps 命令列出的是当前那些进程的快照,就是执行ps 命令的那个时刻 ...
- 前端性能监控：window.performance
window.performance 是W3C性能小组引入的新的API,目前IE9以上的浏览器都支持.一个performance对象的完整结构如下图所示: memory字段代表JavaScript对内 ...
- Phpcms 详情页显示所属栏目的同级栏目
Phpcms详情页是不显示所属栏目的同级栏目的,如果按下面的方式 {loop subcat($parentid) $v} <li{if $v[catid]==$catid} class=&quo ...
- Java使用Schema模式对XML验证
XML允许创作者定义自己的标签,因其灵活的特性让其难以编写和解析.因此必须使用某种模式来约束其结构.目前最流行的这种模式有两种:DTD和SCHEMA,而后者以其独特的优势即将取代DTD模式,目前只是过 ...
- golang中的reflect包用法
最近在写一个自动生成api文档的功能,用到了reflect包来给结构体赋值,给空数组新增一个元素,这样只要定义一个input结构体和一个output的结构体,并填写一些相关tag信息,就能使用程序来生 ...
- css 超出隐藏显示...
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>& ...
- zTree的拖拽排序
ztree本身是可以支持拖拽的,但是却没有找到明确的支持拖拽的排序,也就是说,在拖拽过程中,需要自定义维护拖拽后的顺序并保存至后台. 在这样一个比较常规的需求情况下,网上也有朋友给出了一些解决方案,比 ...
- Mac本地编辑服务器代码
windows上映射网络驱动器可以直接在本地编辑远程服务器的代码,那么在mac上怎么配置呢? 1.打开finder——前往——连接服务器——输入:smb://********(你的机器名) 2.输入服 ...