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

下载demo:ajax loading

代码如下:

function test_ajax(){
$.ajax(
{
type:"GET",//通常会用到两种:GET,POST。默认是:GET
url:"a.php",//(默认: 当前页地址) 发送请求的地址
dataType:"html",//预期服务器返回的数据类型。
beforeSend:beforeSend, //发送请求
success:callback, //请求成功
error:error,//请求出错
complete:complete//请求完成
});
}
function error(XMLHttpRequest, textStatus, errorThrown){
// 通常情况下textStatus和errorThown只有其中一个有值
$("#showResult").append("<div>请求出错啦!</div>");
}
function beforeSend(XMLHttpRequest){
$("#showResult").append("<div><img src='loading.gif' /><div>");
}
function complete(XMLHttpRequest, textStatus){
$("#showResult").remove();
}
function callback(msg){
$("#showResult").append("<div>请求成功,回传数:"+msg+"<div>");
}

方法beforeSend,用于在向服务器发送请求前添加一些处理函数。这是一个ajax事件,在ajax请求开始之前就被触发,通常允许用户修改XMLHttpRequest对象(比如说设置附加的头部信息),关于ajax事件的解释可参考文档:http://docs.jquery.com/Ajax_Events

我们还见到一种情况,很多网站在加载内容的过程中给出“数据加载中,请稍候”的提示,当内容被加载完毕后显示内容。可以设置默认文本显示为加载中的提示,当内容加载完毕时,我们可以通过ID选择器,将该标签中的文本替换成最终的内容。以此来取代beforeSend,效率更高。

什么时候用beforeSend,什么时候用文本替换,取决于ajax请求前后你所展示的DOM元素是否一致,如果你所展示的DOM元素在请求之前已经存在,那么通过上述文本替换的方式来处理会好些,如果除此以外你还需增加其他的需求,那么还是用beforeSend来处理吧。

转载:jquery.ajax之beforeSend方法使用介绍的更多相关文章

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

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

  2. jquery Ajax请求示例,jquery Ajax基本请求方法示例

    jquery Ajax请求示例,jquery Ajax基本请求方法示例 ================================ ©Copyright 蕃薯耀 2018年5月7日 https: ...

  3. jQuery ajax中serialize()方法增加其他参数

    表单提交 使用jQuery.ajax()进行表单提交时,需要传递参数,最直接的方法便是使用Form的serializa()将表单序列化,前提只是将Form表单中的name属性与数据库的字段名保持一致便 ...

  4. asp.net如何在前台利用jquery Ajax调用后台方法

    一 :最近因为帮同事开发项目使用到了asp.net,而我又想实现Ajax异步请求....从网上查询了一下资料之后,原来在asp.net中利用Ajax调用后台方法同样很简单,为了便于自己以后查看,特将此 ...

  5. jquery ajax缓存问题解决方法小结

    今天在做一个ajax数据提交功能开始利用get方式一直发现提交的数据都是一样,返回的数据也很久不刷新了,这个我知道是ajax缓存问题,后来在网上整理了一些ajax缓存问题解决方法,下面给大家分享一下. ...

  6. [转载]jquery ajax/post/get 传参数给 mvc的action

    jquery ajax/post/get 传参数给 mvc的action 1.ActionResult Test1     2.View  Test1.aspx 3.ajax page 4.MetaO ...

  7. 浅析jquery ajax异步调用方法中不能给全局变量赋值的原因及解决方法(转载)

    在调用一个jquery的ajax方法时我们有时会需要该方法返回一个值或者给某个全局变量赋值,可是我们发现程序执行完后并没有获取到我们想要的值,这时很有可能是因为你用的是ajax的异步调用async:t ...

  8. jQuery Ajax之load()方法

    jQuery对Ajax操作进行了封装,在jQuery中$.ajax()方法属于最底层的方法,第2层是load().$.get()和$.post()方法,第3层是$.getScript()和$.getJ ...

  9. Jquery.Ajax的使用方法

    1.Get $('.manager_republish.notVIP').click(function () { $.ajax({ async: false, type: "get" ...

随机推荐

  1. 开源Html5+Websocket+Mqtt实时聊天室

    本应用示例使用Coolpy7作为Mqtt服务器并启用Websocket代理完美支持高并发大流量即时通过能力,本示以即时通信聊天为为例.还可以应用到其他软件应用如:网页客服系统.网站信息通知.网页即时通 ...

  2. Hungary Algorithm国外板子

    Codeforces 1107一题除了dp做法还有二分带权匹配O(n^3)做法,国外网友的板子时间非常优秀,但矩阵设定的事情并不是很懂-- //Codeforces 1107F const int m ...

  3. Codeforces 1136E(转化+线段树维护)

    题目传送 虽然线段树比较显然但是发现a数组并不好维护.考虑将a转化为好维护的数组b. 方法 这里我将k[1]设为0,对应着\[a[1] + k[1] <= a[2]\]不难得出\[a[i] + ...

  4. Spring+Quartz配置定时任务

    一.Quartz介绍 在企业应用中,我们经常会碰到时间任务调度的需求,比如每天凌晨生成前天报表,每小时生成一次汇总数据等等.Quartz是出了名的任务调度框架,它可以与J2SE和J2EE应用程序相结合 ...

  5. 089 Gray Code 格雷编码

    格雷编码是一个二进制数字系统,在该系统中,两个连续的数值仅有一个位数的差异.给定一个代表编码总位数的非负整数 n,打印格雷码序列.格雷码序列必须以0开头.例如, 给定 n = 2, 返回 [0,1,3 ...

  6. php pack、unpack、ord 函数使用方法(二进制流接口应用实例)

    在工作中,我也逐渐了解到pack,unpack,ord对于二进制字节处理的强大. 下面我逐一介绍它们.在我们工作中,用到它们的估计不多. 我在最近一个工作中,因为通讯需要用到二进制流,然后接口用php ...

  7. 3、从尾到头打印链表------------>剑指offer系列

    题目 输入一个链表,按链表值从尾到头的顺序返回一个ArrayList. 分析 要了解链表的数据结构: val属性存储当前的值,next属性存储下一个节点的引用. 要遍历链表就是不断找到当前节点的nex ...

  8. jQuery1.6.1源码分析系列(作者:nuysoft/高云)

    作者:nuysoft/高云 QQ:47214707 Email:nuysoft@gmail.com jQuery源码分析(版本1.6.1) 00 前言开光 01 总体架构 02 正则表达式-RegEx ...

  9. rpm包的安装方法

    每次都记不住,这次必须整理一下!cd到你存放rpm文件包的目录rpm -ivh linuxqq-v1.0.2-beta1.i386.rpm安装时可能会遇到缺少包的错误.rpm -ivh --repla ...

  10. Dll加载总是出问题,显示无法加载

    我从网上找了一个类似的问题,具体的内容如下 创建了个mfc的共享链接库,里面只有这样一个加法 _declspec(dllexport) int add(int a,int b){ return a+b ...