- 第2版前言
- 本书结构
- 读者对象
- 本书约定
- 读者反馈&示例下载
- 疑难解答&本书勘误
- 第1章 认识 jQuery
- 第2章 jQuery 选择器
- 第3章 jQuery 中的 DOM 操作
- 第4章 jQuery 中的事件和动画
- 第5章 jQuery 对表单、表格的操作及更多应用
- 第6章 jQuery 与 Ajax 的应用
- 第7章 jQuery 插件的使用和写法
- 第8章 用 jQuery 打造个性网站
- 第9章 jQuery Mobile
- 第10章 jQuery 各个版本的变化
- 第11章 jQuery 性能优化和技巧
- 附录A 关于 $(document).ready() 函数
- 附录B Firebug
- 附录C Ajax 的 XMLHttpRequest 对象的属性和方法
- 附录D jQuery $.ajax() 方法的参数详解
- 附录E jQuery 加载并解析 XML
- 附录F 插件 API
- 附录G jQuery 速查表
6.7 jQuery 中的 Ajax 全局事件
jQuery简化Ajax操作不仅体现在调用Ajax方法和处理响应方面,而且还体现在对调用Ajax方法的过程中的HTTP请求的控制。通过jQuery提供的一些自定义全局函数,能够为各种与Ajax相关的事件注册回调函数。例如当Ajax请求开始时,会触发ajaxStart()方法的回调函数;当Ajax请求结束时,会触发ajaxStop()方法的回调函数。这些方法都是全局的方法,因此无论创建它们的代码位于何处,只要有Ajax请求发生时,就会触发它们。在前面例子中,远程读取Flickr.com网站的图片速度可能会比较慢,如果在加载的过程中,不给用户提供一些提示和反馈信息,很容易让用户误认为按钮单击无用,使用户对网站失去信心。
此时,就需要为网页添加一个提示信息,常用的提示信息是加载中…
,代码如下:
然后用CSS控制元素隐藏,当Ajax请求开始的时候,将此元素显示,用来提示用户Ajax请求正在进行。当Ajax请求结束后,将此元素隐藏。代码如下:
这样一来,在Ajax请求过程中,只要图片还未加载完毕,就会一直显示加载中…
的提示信息,看似很简单的一个改进,却将极大地改善用户的体验。效果如图6-13所示。
如果在此页面中的其他地方也使用Ajax,该提示信息仍然有效,因为它是全局的。如图6-14所示。
图6-13 显示"加载中…"的提示信息
图6-14 demo2也使用同一个提示信息
jQuery的Ajax全局事件中还有几个方法,也可以在使用Ajax方法的过程中为其带来方便。如表6-4所示。
表6-4 另外几个方法
方 法 名 称 | 说 明 |
ajaxComplete(callback) | Ajax请求完成时执行的函数 |
ajaxError(callback) | Ajax请求发生错误时执行的函数,捕捉到的错误可以作为最后一个参数传递 |
ajaxSend(callback) | Ajax请求发送前执行的函数 |
ajaxSuccess(callback) | Ajax请求成功时执行的函数 |
注意:1,如果想使某个Ajax请求不受全局方法的影响,那么可以在使用$.ajax(options)方法时,将参数中的global设置为false,jQuery代码如下:
2,在jQuery1.5版本之后,如果Ajax请求不触发全局方法,那么可以设置:
具体原因请查看:http://bugs.jquery.com/ticket/8338
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论