js进阶 14-9 ajax事件有哪些

一、总结

一句话总结：ajax开始时事件、发送时事件，请求完成时事件，请求成功时事件，请求结束时事件，请求错误时事件事件。

1、ajax事件的监听对象是谁？

都是document对象

21         $(document).ajaxStart(function(){

22             alert('ajaxStart() AJAX 请求开始时执行函数')

23         })

24         $(document).ajaxComplete(function(){

25           alert('ajaxComplete() AJAX 请求完成时执行函数')

26         });

2、ajax事件如何使用？

直接监听document对象，然后在ajax发生的时候，这些事件就会被调用

21         $(document).ajaxStart(function(){

22             alert('ajaxStart() AJAX 请求开始时执行函数')

23         })

二、ajax事件有哪些

1、相关知识

ajax事件

$.ajax()方法是jQuery底层AJAX实现。之前讲的简单易用的$.get,$.post 等为高层实现见。$.ajax()返回其创建的XMLHttpRequest 对象。大多数情况下我们无需直接操作该函数。除非你需要操作不常用的选项，以获得更多的灵活性。

  • ajaxStart()AJAX请求开始时执行函数。
  • ajaxStop()AJAX请求结束时执行函数。
  • ajaxComplete()AJAX请求完成时执行函数。
  • ajaxError()AJAX请求发生错误时执行函数。
  • ajaxSuccess()AJAX请求成功时执行函数。
  • ajaxSend()AJAX请求发送前执行函数。Ajax事件。
 

2、代码

html

 <!DOCTYPE html>

 <html lang="en">

 <style>

 </style>

 <head>

     <meta charset="UTF-8">

     <title>演示文档</title>

     <script type="text/javascript" src="jquery-3.1.1.min.js"></script>

     <style type="text/css">

       </style>

 </style>

 </head>

 <body>

     <input type="button" id="btn" value="Ajax测试">

     <div id="test"></div>

 <script type="text/javascript">

     $(function(){

         $('#btn').click(function(){

             $('#test').load('test1.php')

         })

         $(document).ajaxStart(function(){

             alert('ajaxStart() AJAX 请求开始时执行函数')

         })

         $(document).ajaxComplete(function(){

           alert('ajaxComplete() AJAX 请求完成时执行函数')

         });

         $(document).ajaxStop(function(){

           alert('ajaxStop() AJAX 请求结束时执行函数。')

         });

         $(document).ajaxSuccess(function(){

           alert('ajaxSuccess() aAJAX 请求成功时执行函数')

         });

         $(document).ajaxSend(function(){

           alert('ajaxSend() AJAX 请求发送前执行函数。Ajax 事')

         })

         $(document).ajaxSend(function(){

           alert('请求发生错误！')

         })

      })

 </script>

 </body>

 </html>

php

 <?php

     echo "AJAX 最大的优点是在不重新加载整个页面的情况下，可以与服务器交换数据并更新部分网页内容。";

 ?>
 

js进阶 14-9 ajax事件有哪些的更多相关文章

  1. js进阶 14 jquery的ajax有哪些函数和事件（多练）

    js进阶 14 jquery的ajax有哪些函数和事件(多练) 一.总结 一句话总结:常用:load.ajax.post.get.getScript().getJSON().表单序列化,ajax事件这 ...

  2. js进阶---12-12、jquery事件委托怎么使用

    js进阶---12-12.jquery事件委托怎么使用 一.总结 一句话总结:通过on方法(事件委托),给要绑定事件的元素的祖先绑定事件,从而达到效果. 1.事件委托是什么? 通过事件冒泡,让子元素绑 ...

  3. js进阶 12-14 jquery的事件触发函数是哪两个

    js进阶 12-14 jquery的事件触发函数是哪两个 一.总结 一句话总结:trigger和triggerHandler 1.trigger传额外参数时候的注意事项是什么? 注意样例中是三个参数 ...

  4. js进阶 12-4 jquery键盘事件如何使用

    js进阶 12-4 jquery键盘事件如何使用 一.总结 一句话总结:键盘和鼠标都是外设输入设备,所以函数很像,所以使用就像鼠标事件click一样 1.jquery键盘事件有哪三个? 1(up和do ...

  5. JS进阶 | 解决JQ keyup事件延迟的问题

    写在前面 在使用keyup事件时,存在一个问题,假如想要做出类似于表单验证的demo:表单输入账号 “xxx” 后  再去ajax异步去后台数据库匹配,但是keyup事件的原理是每次键盘事件弹起就会检 ...

  6. Ext JS学习第十六天 事件机制event（一） DotNet进阶系列(持续更新) 第一节：.Net版基于WebSocket的聊天室样例 第十五节：深入理解async和await的作用及各种适用场景和用法 第十五节：深入理解async和await的作用及各种适用场景和用法 前端自动化准备和详细配置(NVM、NPM/CNPM、NodeJs、NRM、WebPack、Gulp/Grunt、G

    code&monkey   Ext JS学习第十六天 事件机制event(一) 此文用来记录学习笔记: 休息了好几天,从今天开始继续保持更新,鞭策自己学习 今天我们来说一说什么是事件,对于事件 ...

  7. js进阶 14-2 如何用ajax验证登陆状态（这里用load方法）

    js进阶 14-2 如何用ajax验证登陆状态(这里用load方法) 一.总结 一句话总结:$('#test').load('test.php?password=1234560'),这样就get方式提 ...

  8. js进阶ajax基本用法（创建对象，连接服务器，发送请求，获取服务器传过来的数据）

    js进阶ajax基本用法(创建对象,连接服务器,发送请求,获取服务器传过来的数据) 一.总结 1.ajax的浏览器的window对象的XMLHtmlRequest对象的两个重要方法:open(),se ...

  9. js进阶课程ajax简介（ajax是浏览器来实现的）

    js进阶课程ajax简介(ajax是浏览器来实现的) 一.总结 1.ajax使用需要服务器支持,比如phpstudy 2.ajax是浏览器支持的功能:ajax有个核心对象XMLHttpRequest, ...

随机推荐

  1. 使用Spring Boot Actuator、Jolokia和Grafana实现准实时监控--转

    原文地址:http://mp.weixin.qq.com/s?__biz=MzAxODcyNjEzNQ==&mid=2247483789&idx=1&sn=ae11f04780 ...

  2. SQL 小技能

    1. SET STATISTICS TIMEON   附带原文 2.关于索引,是自己可以用Tsql语句建,也可以在设计表的时候选中某一个字段建立索引   一般而言,主键属于聚合索引(字典:A-Z);反 ...

  3. 用efibootmgr管理UEFI启动项，添加丢失的启动项

    UEFI用来替代传统BIOS引导操作系统,学会修改UEFI启动项也变得十分重要,UEFI全称为:“统一的可扩展固件接口”(Unified Extensible Firmware Interface), ...

  4. python关于sorted里面key，reverse以及lamdba，operator这几个鸟人

     关于sorted:   help里给的解释 >>> help(sorted) Help on built-in function sorted in module __builti ...

  5. Json学习总结（1）——Java和JavaScript中使用Json方法大全

    摘要:JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式.它基于ECMAScript的一个子集. JSON采用完全独立于语言的文本格式,但是也使用了类似于C语 ...

  6. Tools-->SQL Server Profiler监视数据库

    http://www.cnblogs.com/lorking/p/4062787.html https://docs.microsoft.com/en-us/sql/tools/sql-server- ...

  7. QQ 特效学习 二 侧滑删除

    上篇文章: http://www.cnblogs.com/xurui1995/p/5798631.html 今天来写不仅是qq而且在别的软件上也特别流行的侧滑删除 其实套路和前篇的一样,一个自定义Vi ...

  8. H.264视频编解码SoC满足高清DVR设计需求

    硬盘录像机(DVR)作为监控系统的核心部件之一,在10年里高速发展,从模拟磁带机的替代品演变成具有自己独特价值的专业监控数字平台,并被市场广泛接受.监控系统伴随DVR这些年的发展向着IP化.智能化发展 ...

  9. Enity Framework已经是.NET下最主要的ORM了

    Enity Framework已经是.NET下最主要的ORM了.而ORM从一个Mapping的概念开始,到现在已经得到了一定的升华,特别是EF等对ORM框架面向对象能力的升华.切实地说,就是ORM让数 ...

  10. vim--学习之emmet插件前端开发

    Emmet 在vim的使用: 1.嵌套 <ctr+y>+,(ctr+y+逗号三者的组合键,ctr+y一起按在按逗号)相当于Ememet中的Tab键. 2.内容的包围: 写好内容,退出编辑模 ...