jquery.ajax之beforeSend方法使用介绍
更新时间：2014年12月08日 09:25:05 投稿：junjie
这篇文章主要介绍了jquery.ajax之beforeSend方法使用介绍,beforeSend方法用于在向服务器发送请求前添加一些处理函数,需要的朋友可以参考下
常见的一种效果，在用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来处理吧。
您可能感兴趣的文章:
相关文章
在做web前端开发的时候经常遇到图片滑动切换特效，接下来通过本文给大家分享使用jQuery实现鼠标点击左右按钮滑动切换特效，感兴趣的朋友参考实现代码2017-08-08
jQuery插件FusionCharts绘制2D双折线图效果示例【附demo源码】
这篇文章主要介绍了jQuery插件FusionCharts绘制2D双折线图效果,结合实例形式分析了jQuery使用FusionCharts结合xml数据载入实现2D双折线图绘制的相关操作技巧,并附带demo源码供读者下载参考,需要的朋友可以参考下2017-04-04
本文给大家分享两种方法实现''推拉门''动画效果也可以称作是手风琴效果，具体实现方法大家通过本文一起学习吧2017-08-08
这篇文章主要介绍了修改或扩展jQuery原生方法的代码实例,本文用一个扩展jquery原生方法val的例子,讲解了如何对jquery原生方法修改或扩展,需要的朋友可以参考下2015-01-01
$.trim(str)的作用是去掉字符串首尾空格，下面为大家介绍下其具体的使用2014-05-05
JQuery 拾色器插件发布-jquery.icolor.js
web项目中不少地方需要用到颜色选择器，比如设置某个元素的背景色、边框色等等，按照我们交互设计的期望-设色器最好简单易用，仅显示常用的那些色块给用户选择，另外提供一个输入框方便用户输入自定义的色值。2010-10-10
本文主要介绍了Jqprint实现页面打印的具体方法，并提供了Jqprint插件下载。具有一定的参考价值，下面跟着小编一起来看下吧2017-01-01
这篇文章主要介绍了jQuery中height()方法用法,以实例形式较为详细分析了height()方法返回元素高度的用法与相关注意事项,具有一定的参考借鉴价值,需要的朋友可以参考下2014-12-12
火狐4、谷歌12不支持Jquery Validator的解决方法分享
在火狐4、谷歌12浏览器中，使用jquery.tools.min 1.2.5版的Jquery Validator，不出现验证提示框。在ie7、8、9下就好用。2011-06-06
点击标题，输入详细信息，点击确定按钮，完成，把不必要的选项隐藏，当用户真正有需要的时候，在显示出来2013-04-04
最新评论