转载:jquery.ajax之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来处理吧。
转载:jquery.ajax之beforeSend方法使用介绍的更多相关文章
- jquery.ajax之beforeSend方法使用介绍
常见的一种效果,在用ajax请求时,没有返回前会出现前出现一个转动的loading小图标或者“内容加载中..”,用来告知用户正在请求数据.这个就可以用beforeSend方法来实现. 下载demo:a ...
- jquery Ajax请求示例,jquery Ajax基本请求方法示例
jquery Ajax请求示例,jquery Ajax基本请求方法示例 ================================ ©Copyright 蕃薯耀 2018年5月7日 https: ...
- jQuery ajax中serialize()方法增加其他参数
表单提交 使用jQuery.ajax()进行表单提交时,需要传递参数,最直接的方法便是使用Form的serializa()将表单序列化,前提只是将Form表单中的name属性与数据库的字段名保持一致便 ...
- asp.net如何在前台利用jquery Ajax调用后台方法
一 :最近因为帮同事开发项目使用到了asp.net,而我又想实现Ajax异步请求....从网上查询了一下资料之后,原来在asp.net中利用Ajax调用后台方法同样很简单,为了便于自己以后查看,特将此 ...
- jquery ajax缓存问题解决方法小结
今天在做一个ajax数据提交功能开始利用get方式一直发现提交的数据都是一样,返回的数据也很久不刷新了,这个我知道是ajax缓存问题,后来在网上整理了一些ajax缓存问题解决方法,下面给大家分享一下. ...
- [转载]jquery ajax/post/get 传参数给 mvc的action
jquery ajax/post/get 传参数给 mvc的action 1.ActionResult Test1 2.View Test1.aspx 3.ajax page 4.MetaO ...
- 浅析jquery ajax异步调用方法中不能给全局变量赋值的原因及解决方法(转载)
在调用一个jquery的ajax方法时我们有时会需要该方法返回一个值或者给某个全局变量赋值,可是我们发现程序执行完后并没有获取到我们想要的值,这时很有可能是因为你用的是ajax的异步调用async:t ...
- jQuery Ajax之load()方法
jQuery对Ajax操作进行了封装,在jQuery中$.ajax()方法属于最底层的方法,第2层是load().$.get()和$.post()方法,第3层是$.getScript()和$.getJ ...
- Jquery.Ajax的使用方法
1.Get $('.manager_republish.notVIP').click(function () { $.ajax({ async: false, type: "get" ...
随机推荐
- (转)关于MongoDB你需要知道的几件事
本文列举了颇让作者困惑的一些MongoDB限制,如果你也打算使用MongoDB,那么至少要提前了解这些限制,以免遇到的时候措手不及. 消耗磁盘空间 这是我的第一个困惑:MongoDB会消耗太多的磁盘空 ...
- MyBatis逆向工程中domainObjectRenamingRule报错或无效
使用domainObjectRenamingRule报错 在使用MyBatis逆向工程时报错如下: org.mybatis.generator.exception.XMLParserException ...
- SpringBoot | quartz | @DisallowConcurrentExecution
注释放在job类上, 作用: 将该注解加到job类上,告诉Quartz不要并发地执行同一个job定义(这里指特定的job类)的多个实例.
- [软件工程基础]2017.10.31 第四次 Scrum 会议
具体事项 项目交接燃尽图 每人工作内容 成员 已完成的工作 计划完成的工作 工作中遇到的困难 游心 #7 掌握 PHP:#6 阅读分析 PhyLab 数据处理相关代码 #10 搭建可用的开发测试环境: ...
- 牛客网Java刷题知识点之什么是JSP的3大常用指令、JSP的6大哪些动作、JSP中include指令和include动作有什么区别
不多说,直接上干货! JSP的3大常用指令 包含指令(Include directive):用来包含文件和合并文件内容到当前的页面. 页面指令(Page directive):用来定义JSP页面中特定 ...
- Docker容器与容器数据
Docker容器与容器数据 image 与container 镜像(Image)和容器(Container)的关系,就像是面向对象程序设计中的 类 和 实例 一样,镜像是静态的定义,容器是镜像运行时的 ...
- CImage访问像素及其像素操作总结
MSDN的代码 COLORREF pixel; int maxY = imgOriginal.GetHeight(), maxX = imgOriginal.GetWidth(); byte r,g, ...
- JavaScript单元测试框架:Jasmine
摘抄:http://blog.csdn.net/GuoJiangweigege/article/details/52130589 互联网的快速发展,给web开发人员带来了前所未有的挑战.对于前端开发, ...
- lnmp.org + phpstorm + xdebug
lnmp.org下载安装包安装之: lnmp是个集成安装包,就不用自己在配置lnmp环境 安装phpstorm,破解方法:注册服务器为http://idea.lanyus.com 就可以了 xdebu ...
- COGS 2084. Asm.Def的基本算法
★☆ 输入文件:asm_algo.in 输出文件:asm_algo.out 简单对比时间限制:1 s 内存限制:256 MB [题目描述] “有句美国俗语说,如果走起来像鸭子,叫起来像 ...