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网页加载进度条的实现
Jun 01 jQuery
Vue.js列表渲染绑定jQuery插件的正确姿势
Jun 29 jQuery
jquery拖动改变div大小
Jul 04 jQuery
详解webpack3如何正确引用并使用jQuery库
Aug 26 jQuery
解决html-jquery/js引用外部图片时遇到看不了或出现403的问题
Sep 22 jQuery
jQuery EasyUI window窗口使用实例代码
Dec 25 jQuery
jQuery实现列表的增加和删除功能
Jun 14 jQuery
解决jQuery使用append添加的元素事件无效的问题
Aug 30 jQuery
JS实现点击生成UUID的方法完整实例【基于jQuery】
Jun 12 jQuery
jQuery实现的上拉刷新功能组件示例
May 01 jQuery
jQuery加PHP实现图片上传并提交的示例代码
Jul 16 jQuery
Jquery+javascript实现支付网页数字键盘
Dec 21 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中的时间处理
2006/10/09 PHP
Zend studio for eclipse中使php可以调用mysql相关函数的设置方法
2008/10/13 PHP
Wordpress 相册插件 NextGEN-Gallery 添加目录将中文转为拼音的解决办法
2010/12/29 PHP
php mysql获取表字段名称和字段信息的三种方法
2016/11/13 PHP
PHP连接sftp并下载文件的方法教程
2018/08/26 PHP
jquery ajax 同步异步的执行示例代码
2010/06/23 Javascript
JQuery onload、ready概念介绍及使用方法
2013/04/27 Javascript
原生JavaScript实现连连看游戏(附源码)
2013/11/05 Javascript
js使用for循环及if语句判断多个一样的name
2014/09/09 Javascript
JavaScript学习笔记之定时器
2015/01/22 Javascript
Javascript代码实现仿实例化类
2015/04/03 Javascript
浅析JSONP技术原理及实现
2016/06/08 Javascript
jQuery实现对象转为url参数的方法
2017/01/11 Javascript
基于Bootstrap模态对话框只加载一次 remote 数据的解决方法
2017/07/09 Javascript
详解基于Vue的支持数据双向绑定的select组件
2019/09/02 Javascript
VUE项目中加载已保存的笔记实例方法
2019/09/14 Javascript
解决vant中 tab栏遇到的坑 van-tabs
2020/11/04 Javascript
nodeJs项目在阿里云的简单部署
2020/11/27 NodeJs
[41:41]TFT vs Secret Supermajor小组赛C组 BO3 第一场 6.3
2018/06/04 DOTA
[44:33]EG vs Liquid 2018国际邀请赛小组赛BO2 第二场 8.18
2018/08/19 DOTA
[48:24]完美世界DOTA2联赛循环赛LBZS vs Forest 第一场 10月30日
2020/10/31 DOTA
python实现ftp客户端示例分享
2014/02/17 Python
Python利用Beautiful Soup模块搜索内容详解
2017/03/29 Python
pandas string转dataframe的方法
2018/04/11 Python
Numpy array数据的增、删、改、查实例
2018/06/04 Python
python构建基础的爬虫教学
2018/12/23 Python
使用Python3+PyQT5+Pyserial 实现简单的串口工具方法
2019/02/13 Python
简单的Python调度器Schedule详解
2019/08/30 Python
GLAMGLOW格莱魅美国官网:美国知名的面膜品牌
2016/12/31 全球购物
英国二手iPhone、音乐、电影和游戏商店:musicMagpie
2018/10/26 全球购物
Cinque网上商店:德国服装品牌
2019/03/17 全球购物
英国礼品和生活方式品牌:Treat Republic
2020/11/21 全球购物
教师旷工检讨书
2014/01/18 职场文书
2014公司党员自我评价范文
2014/09/11 职场文书
十二生肖观后感
2015/06/12 职场文书
2015秋季开学典礼致辞
2015/07/16 职场文书