jQuery是经常使用的一个开源js框架,其中的$.ajax请求中有一个beforeSend方法,用于在向服务器发送请求前执行一些动作。

具体可参考jQuery官方文档:http://api.jquery.com/Ajax_Events/

$.ajax({beforeSend: function(){// Handle the beforeSend event},complete: function(){// Handle the complete event}// ......
});

防止重复数据

在实际项目开发中,提交表单时常常由于网络或者其原因,用户点击提交按钮误认为自己没有操作成功,进而会重复提交按钮操作次数,如果页面前端代码没有做一些相应的处理,通常会导致多条同样的数据插入数据库,导致脏数据的增加。要避免这种现象,在$.ajax请求中的beforeSend方法中把提交按钮禁用掉,等到Ajax请求执行完毕,在恢复按钮的可用状态。

举个例子:

// 提交表单数据到后台处理
$.ajax({type: "post",data: studentInfo,contentType: "application/json",url: "/Home/Submit",beforeSend: function () {// 禁用按钮防止重复提交$("#submit").attr({ disabled: "disabled" });},success: function (data) {if (data == "Success") {//清空输入框clearBox();}},complete: function () {$("#submit").removeAttr("disabled");},error: function (data) {console.info("error: " + data.responseText);}
});

模拟Toast效果

ajax请求服务器加载数据列表时提示loading(“加载中,请稍后...”),

$.ajax({beforeSend : function(){showWaiting();$("#loadInfo").empty().append("正在获取文件内容...");  },

Ajax的beforeSend用处相关推荐

  1. 巧用Ajax的beforeSend 提高用户体验--防止重复数据

    巧用Ajax的beforeSend 提高用户体验 jQuery是经常使用的一个开源js框架,其中的$.ajax请求中有一个beforeSend方法,用于在向服务器发送请求前执行一些动作. 具体可参考j ...

  2. jQuery $.Ajax 的beforeSend、complete、success、error的执行顺序和参数

    Ajax每天都在用,但都是复制来的,从来没有看过Ajax的回调函数到底有哪些参数,今天看了一下,记录下来加强记忆,希望能对大家也有些用处. ajax示例: $.ajax({ type: "P ...

  3. Ajax的beforeSend 和 complete

    前端的童鞋们:在项目中都会遇到向后台请求数据: 通常会采用ajax请求,在请求的过程中有时返回的数据过多或者用户网络慢的原因,导致页面一开始会有空白页面,这样给用户带来的体验不好 $.ajax请求中有 ...

  4. jquery.ajax之beforeSend方法使用介绍

    常见的一种效果,在用ajax请求时,没有返回前会出现前出现一个转动的loading小图标或者"内容加载中..",用来告知用户正在请求数据.这个就可以用beforeSend方法来实现 ...

  5. jQuery中Ajax事件beforesend及各参数含义

     Ajax会触发很多事件. 有两种事件,一种是局部事件,一种是全局事件: 局部事件:通过$.ajax来调用并且分配. $.ajax({ beforeSend: function(){ // Han ...

  6. ajax beforesend xhr对象,jQuery中Ajax事件beforesend及各参数含义(示例代码)

    转自:http://blog.sina.com.cn/s/blog_609f9fdd0100wprz.html Ajax会触发很多事件. 有两种事件,一种是局部事件,一种是全局事件: 局部事件:通过$ ...

  7. ajax beforesend xhr对象,jq ajax之beforesend(XHR)

    用于在向服务器发送请求前添加一些处理函数.例如:搜寻附近店铺,未搜寻出来的时候显示:正在搜寻中... 常见的一种效果,在用ajax请求时,没有返回前会出现前出现一个转动的loading小图标或者&qu ...

  8. ajax get before,jquery的ajax()之 beforeSend属性详解

    方法beforeSend,用于在向服务器发送请求前添加一些处理函数.这是一个ajax事件,在ajax请求开始之前就被触发,通常允许用户修改XMLHttpRequest对象(比如说设置附加的头部信息). ...

  9. Ajax的beforeSend

    jQuery是经常使用的一个开源js框架,其中的$.ajax请求中有一个beforeSend方法,用于在向服务器发送请求前执行一些动作. 具体可参考jQuery官方文档:http://api.jque ...

最新文章

  1. VCSA 6.5 HA 配置之五:故障转移测试
  2. 基于tensorflow的MNIST手写字识别
  3. 蓝桥杯 密文搜索(全排列)
  4. GPU云服务器是什么?谷歌宣布将要推出GPU云服务器
  5. AI产品经理必修课:机器学习算法
  6. Java的四种引用——强软弱虚
  7. python实现文件传输_Python实现基于HTTP文件传输实例
  8. IOS图标icon,png去掉高光效果
  9. sql 查询数据库索引重建_不良的数据库索引– SQL查询性能的杀手–建议
  10. 360搜索下拉词下拉框获客方案分享
  11. Linux面试常考(面经总结)
  12. C11标准和C++11标准
  13. 阅读《视音频编解码技术零基础学习方法-雷霄骅》摘要
  14. pandas 二维表与一维记录的转换
  15. [Hadoop in China 2011] 朱会灿:探析腾讯Typhoon云计算平台
  16. 计算机如何添加usb平板电脑,平板电脑没有usb接口怎么办
  17. For A, B such that AB is square, prove trAB = trBA.
  18. 大学软件工程总结,总结到位
  19. 从指数构建原理看待A股的三千点魔咒
  20. 怎样看待中小学stem教育特点

热门文章

  1. Anroid_自定义笑脸View
  2. Chrome - JavaScript调试技巧总结(浏览器调试JS)
  3. iis6 fastcgiiis6 mysql php 2013_Windows 2003+IIS6+PHP5.3.8(FastCGI)的安装配置教程说明
  4. Netflix下载占用了三分之一互联网带宽
  5. Qt软键盘中/英文输入法
  6. redis实现同步锁的一种实例
  7. 深度学习-服务端训练+android客户端物体识别实战(caffe+mobilenet+ncnn+android)
  8. JavaScript全局变量、局部变量
  9. javascript 引入全局变量
  10. rsync+inotify文件实时同步