jquery ajax 请求小技巧实例分析


Posted in jQuery onNovember 11, 2019

本文实例讲述了jquery ajax 请求小技巧。分享给大家供大家参考,具体如下:

jquery   是一个非常好用的js框架,它为我们提供了很多工具。启动异步请求就是很好用的一个工具

官方推荐的ajax 请求格式

$.ajax({
   url:"http://xxxxxxxxxxxxxxxxx/",//你的域名
   dataType:"json",        //对服务器返回的结果进行该数据格式处理 我这里写了json 也可以红xml、text、html 等格式
   type:"get',           //请求到服务器的方式 我这里是get 也可以用其它形式 如post
   beforeSend:function(res){},   //在请求之前会调用这个方法  其中的res 就是XMLHttpRequest 对象
   success:function(result){}   //服务器返回的数据进行dataTyoe 设置的格式 处理后返回的结果
})

在这其中,$.ajax()  方法中传入的数据是一个json   这不难发现吧。  那我们完全可以这样去调用

var ajaxJson = {
   url:"http://xxxxxxxxxxxxxxxxx/",
  dataType:"json",
   type:"get',
   beforeSend:function(res){},  //在请求之前会调用这个方法  其中的res 就是XMLHttpRequest 对象
   success:function(result){}
}
$.ajax(ajaxJson);      //这样去使用。

如果我们想用户在某一个时刻只进行一个请求,而不会产生多余的请求怎么办呢?

在ajax 前面添加一个判定。

var ajax_oper = {
   ajax_status : true,             //当前ajax执行状态
   ajax_json : function(ajaxJson){
       if(!this.ajax_status) return false; // 当这个条件成立的时候,就认为当前有一个正在执行的ajax操作
       $.ajax(ajaxJson);
    }
}

然后 我们在ajaxJson变量中添加如下配置

var ajaxJson={
   url:"http://xxxxxxxxxxxxxxxxx/",
   dataType:"json",
   type:"get',
   beforeSend:function(res){
       ajax_oper.ajax_status = false;
   },
   success:function(result){
        ajax_oper.ajax_status = true;
   }
}
$.ajax(ajaxJson);

这样就可以在每次请求的时候判定一下 当前是否有正在执行的ajax请求 如果有就返回,不去执行。如果没有就执行。当一个ajax执行完毕后我们将ajax_oper的状态调整回来等待下一次请求的进行更改。

当然在移动web开发当中touch事件 有点违背原理,我们在测试的时候发现,在同一时间。touch事件被触发了多次,并且产生了多个ajax请求。更改ajax_status并没有起到作用,分析的方案是 touch事件灵敏到了,连ajax_oper的状态还没更改就已经被触发了多次,也就是在统一时间多个ajax请求都在执行$.ajax方法。这种解决方案,第一就是更改touch事件为click事件,第二就是添加多个ajax_oper 状态,层层判定(也有点不保险哈),第三就是更改后台逻辑处理,如在数据库处理的时候添加触发器,每次在更改的时候触发器会先处理一次,然后根据触发器的处理执行相应的处理。  对了,提示一下,在mysql innodb 表 事务处理过程中    也是会触发触发器的。根据结果进行commit 和 rollback。

更多关于jQuery相关内容可查看本站专题:《jquery中Ajax用法总结》、《jQuery扩展技巧总结》、《jQuery常用插件及用法总结》、《jQuery常见经典特效汇总》及《jquery选择器用法总结》

希望本文所述对大家jQuery程序设计有所帮助。

jQuery 相关文章推荐
jQuery.Form实现Ajax上传文件同时设置headers的方法
Jun 26 jQuery
jQuery实现节点的追加、替换、删除、复制功能示例
Jul 11 jQuery
JQuery和html+css实现带小圆点和左右按钮的轮播图实例
Jul 22 jQuery
jQuery+HTML5实现WebGL高性能烟花绽放动画效果【附demo源码下载】
Aug 18 jQuery
jquery之基本选择器practice(实例讲解)
Sep 30 jQuery
jQuery获取随机颜色的实例代码
May 21 jQuery
jQuery扩展方法实现Form表单与Json互相转换的实例代码
Sep 05 jQuery
jquery实现联想词搜索框和搜索结果分页的示例
Oct 10 jQuery
jQuery创建折叠式菜单
Jun 15 jQuery
jQuery子选择器与可见性选择器实例分析
Jun 28 jQuery
jquery ui 实现 tab标签功能示例【测试可用】
Jul 25 jQuery
jQuery 添加元素和删除元素的方法
Jul 15 jQuery
jQuery利用cookie 实现本地收藏功能(不重复无需多次命名)
Nov 07 #jQuery
jQuery实现form表单基于ajax无刷新提交方法实例代码
Nov 04 #jQuery
jQuery鼠标滑过横向时间轴样式(代码详解)
Nov 01 #jQuery
jQuery高级编程之js对象、json与ajax用法实例分析
Nov 01 #jQuery
Javascript和jquery在selenium的使用过程
Oct 31 #jQuery
JQuery 实现文件下载的常用方法分析
Oct 29 #jQuery
jquery validate 实现动态增加/删除验证规则操作示例
Oct 28 #jQuery
You might like
php中过滤非法字符的具体实现
2013/10/29 PHP
PHP开发框架kohana中处理ajax请求的例子
2014/07/14 PHP
PHP使用CURL实现对带有验证码的网站进行模拟登录的方法
2014/07/23 PHP
php mysql_list_dbs()函数用法示例
2017/03/29 PHP
PHP解决高并发的优化方案实例
2020/12/10 PHP
Prototype 工具函数 学习
2009/07/23 Javascript
AJAX异步从优酷专辑中采集所有视频及信息(JavaScript代码)
2010/11/20 Javascript
Javascript WebSocket使用实例介绍(简明入门教程)
2014/04/16 Javascript
JavaScript动态修改弹出窗口大小的方法
2015/04/06 Javascript
JavaScript使用位运算符判断奇数和偶数的方法
2015/06/01 Javascript
JavaScript文档碎片操作实例分析
2015/12/12 Javascript
js实现简单排列组合的方法
2016/01/27 Javascript
详解如何构建Angular项目目录结构
2017/07/13 Javascript
详解node nvm进行node多版本管理
2017/10/21 Javascript
解决vue2 在mounted函数无法获取prop中的变量问题
2018/11/15 Javascript
websocket4.0+typescript 实现热更新的方法
2019/08/14 Javascript
微信小程序仿抖音视频之整屏上下切换功能的实现代码
2020/05/24 Javascript
[02:14]完美“圣”典2016风云人物:xiao8专访
2016/12/01 DOTA
python实现自动重启本程序的方法
2015/07/09 Python
python批量赋值操作实例
2018/10/22 Python
python打包生成的exe文件运行时提示缺少模块的解决方法
2018/10/31 Python
Python使用requests提交HTTP表单的方法
2018/12/26 Python
为什么你还不懂得怎么使用Python协程
2019/05/13 Python
python如何保证输入键入数字的方法
2019/08/23 Python
Python使用QQ邮箱发送邮件报错smtplib.SMTPAuthenticationError
2019/12/20 Python
Python用input输入列表的实例代码
2020/02/07 Python
Python读入mnist二进制图像文件并显示实例
2020/04/24 Python
Python发送邮件封装实现过程详解
2020/05/09 Python
使用JS+CSS3技术:让你的名字动起来
2013/04/27 HTML / CSS
美国家居装饰网上商店:Lulu & Georgia
2019/09/14 全球购物
美国精品地毯网站:Boutique Rugs
2020/03/04 全球购物
荷兰家电销售网站:Welhof
2020/12/08 全球购物
中学优秀班主任事迹材料
2014/05/01 职场文书
勿忘国耻9.18演讲稿(经典篇)
2014/09/14 职场文书
大明湖导游词
2015/02/03 职场文书
一篇文章告诉你如何实现Vue前端分页和后端分页
2022/02/18 Vue.js