jquery之ajax——全局事件引用方式以及各个事件(全局/局部)执行顺序

2023-10-27

jquery中各个事件执行顺序如下:

1.ajaxStart(全局事件)

2.beforeSend(局部事件)

3.ajaxSend(全局事件)

4.success(局部事件)

5.ajaxSuccess(全局事件)

6.error(局部事件)

7.ajaxError (全局事件)

8.complete(局部事件)

9.ajaxComplete(全局事件)

10.ajaxStop(全局事件)

其中,全局事件可以在ajax相关方法外引用(比如,通过该方式将ajax执行各个阶段的信息显示在页面某个地方)。

下例演示一次ajax请求过程中各个事件执行的顺序,以及全局ajax的使用方法

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" 
                    "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
  <mce:script src="http://code.jquery.com/jquery-latest.js" mce_src="http://code.jquery.com/jquery-latest.js"></mce:script>
  
  <mce:script type="text/javascript"><!--
  $( function(){
       // 点击按钮,并执行ajax请求
      $("#ajaxReuqestID").click( function(){
              $.ajax({
                   url: "http://blog.csdn.net/gaoyusi4964238",
                   beforeSend: function(){
                       $("#ajaxStateID").text("berforeSend");
                        alert("berforeSend");
                  },
                   success:  function(){
                       $("#ajaxStateID").text("success");
                       alert("success");    
                  },
                  error: function(){
                      $("#ajaxStateID").text("error");
                       alert("error");
                  },
                  complete: function(){
                      $("#ajaxStateID").text("complete");
                       alert("complete");
                  }
                 });
          });
          
          $("#ajaxStateID").ajaxStart( function(){
              $( this).text("ajaxStart");
              alert("ajaxStart");
          }).ajaxSend( function(){
              $( this).text("ajaxSend");
              alert("ajaxSend");
          }).ajaxSuccess( function(){
              $( this).text("ajaxSuccess");
              alert("ajaxSuccess");
          }).ajaxError( function(){
              $( this).text("ajaxError");
              alert("ajaxError");
          }).ajaxComplete( function(){
              $( this).text("ajaxComplete");
              alert("ajaxComplete");
          }).ajaxStop( function(){
              $( this).text("ajaxStop");
              alert("ajaxStop");
          });
      })
  
//  --></mce:script>
 
</head>
<body>
    <input type="button" value="点击触发ajax请求" id="ajaxReuqestID"/>
  <div id="ajaxStateID"></div>
</body>
</html>

 

 
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

jquery之ajax——全局事件引用方式以及各个事件(全局/局部)执行顺序 的相关文章

  • 使用 vscode 调试器调试 next.js

    我已经使用安装了一个项目创建下一个应用程序 https github com segmentio create next app 我需要使用我的编辑器 vscode 调试服务器端渲染 所以我访问过vscode recipes 如何调试 ne
  • 主干视图 DOM 元素已删除

    我一直在阅读有关 Backbone js 僵尸 或内存泄漏 问题的信息 基本上 当您不再需要该元素时 您必须从 DOM 中解除绑定并删除该元素 以确保所有事件也被删除 现在 我有一个包含几个容器的单页应用程序 div div div div
  • React js Stripe 结账不起作用

    我正在尝试在 React js 应用程序中呈现条带结账默认表单
  • 不和谐机器人 |不和谐.js |类型错误:无法读取未定义的属性“长度”

    我正在制作一个 Discord 机器人 并且正在使用 CodeLyon 的视频作为参考 该错误位于我的 message js 文件中 该文件包含以下内容 require dotenv config create cooldowns map
  • 使用 JavaScript 使链接保持活动状态并在单击时显示悬停效果

    I am struggling to make this work I d like to make it where if O F is clicked the hover state stays active if another li
  • 如何防止 Iframe 在与浏览器交互后弄乱浏览器的历史记录?

    因此 就我而言 我使用 Iframe 将 Grafana 附加到我的页面 这为我提供了漂亮且易于使用的图表 可以注意到 每次在图表上进行放大或缩小 使用鼠标单击 交互后 Grafana 的 Iframe 都会在我的 Angular 页面上触
  • 使用 Angular 下载具有动态 src 的脚本

    Angular 提供了通过动态名称动态加载模板的方法ng include 该部分中的内联 JS 和 CSS 可以正常加载 但没有一个好的方法来下载带有动态 url 的脚本 我们需要下载脚本 相对于调用它们的 html 部分的路径 即我们有一
  • 在 Wordpress 站点中进行 AJAX 调用时出现问题

    我在使用 Wordpress 站点功能的 AJAX 部分时遇到了一些问题 该功能接受在表单上输入的邮政编码 使用 PHP 函数来查找邮政编码是否引用特定位置并返回到该位置的永久链接 我的第一个问题是关于我构建的表单 现在我的表单操作是空白的
  • 可以使用 jQuery 或 Javascript 将图片的特定部分用作链接吗?

    我有这个想法 将图片 而不是文本 的各个部分链接到不同的页面或网站 并且我想在不实际创建不同的照片并将它们彼此靠近的情况下完成 这样看起来就像是一张完整的图片 这里有人知道如何使用 JavaScript 的变体 例如 jQuery 或纯 J
  • 除了更改标题之外,如何在 Firefox 中强制另存为对话框?

    有没有办法在 ff 中强制打开 www example com example pdf 的另存为对话框 我无法更改标题 如果您可以将文件以 Base64 格式输出到客户端 则可以使用 data uri 进行下载 location href
  • Babel 7 Jest Core JS“TypeError:wks不是函数”

    将我的项目升级到 Babel 7 后 通过 Jest 运行测试会抛出以下错误 测试在 Babel 6 中运行没有任何问题 但在 Babel 7 中失败并出现以下错误 TypeError wks is not a function at Ob
  • 为 illustrator 导出脚本以保存为 web jpg

    任何人都可以帮我为 illustrator CC2017 编写一个脚本 将文件以 JPG 格式导出到网络 旧版 然后保存文件并关闭 我有 700 个文件 每个文件有 2 个画板 单击 文件 gt 导出 gt 另存为 Web 旧版 然后右键文
  • 为什么在 Internet Explorer 中访问 localStorage 对象会引发错误?

    我正在解决一个客户端问题 Modernizr 意外地没有检测到对localStorageInternet Explorer 9 中的对象 我的页面正确使用 HTML 5 文档类型 并且开发人员工具报告该页面具有 IE9 的浏览器模式和 IE
  • HTML 离线应用程序缓存,列出下载的文件

    作为我正在构建的离线 Web 应用程序的加载屏幕的一部分 使用缓存清单 http developer apple com library safari documentation iPhone Conceptual SafariJSData
  • Javascript 纪元时间(以天为单位)

    我需要以天为单位的纪元时间 迄今为止 我已经看到过有关如何翻译它的帖子 但几天后就没有了 我对纪元时间很不好 我怎么能得到这个 我需要以天为单位的纪元时间 我将解释为您想要自纪元以来的天数 纪元本身是第 0 天 或第 1 天的开始 无论您如
  • Safari 支持 JavaScript window.onerror 吗?

    我有一个附加到 window onerror 的函数 window onerror function errorMsg url line window alert asdf 这在 firefox chrome 和 IE 中工作正常 但在 s
  • 在 React.js 中编辑丰富的数据结构

    我正在尝试为数据结构创建一个简单的基于网格的编辑器 但我在使用 React js 时遇到了一些概念问题 他们的文档对此没有太大帮助 所以我希望这里有人可以提供帮助 首先 将状态从外部组件传输到内部组件的正确方法是什么 是否有可能将内部组件中
  • 使用 Ajax 请求作为源数据的 Jquery 自动完成搜索

    我想做的事 我想使用 jquery 自动完成函数创建一个输入文本字段 该函数从跨域curl 请求获取源数据 结果应该与此示例完全相同 CSS 在这里并不重要 http abload de img jquerydblf5 png http a
  • 导致回发到与弹出窗口不同的页面

    我有一个主页和一个详细信息页面 详细信息页面是从主页调用的 JavaScript 弹出窗口 当单击详细信息页面上的 保存 按钮时 我希望主页 刷新 是否有一种方法可以调用主页的回发 同时还可以从详细信息页面维护保存回发 Edit 使用win
  • fullCalendar 未显示正确的结束日期

    我正在看调试页面 http jsbin com wukofacaxu edit js outputFullCalendar 官方网站的 我想安排一个活动时间为 22 09 2015 至 30 09 2015 dd mm yyyy 但它只显示

随机推荐

  • 人工智能芯片

    发展趋势 人工智能技术研究的催化剂 新型高性能计算架构 参考寒武纪芯片 华为NPU 高通5G芯片 计算芯片发展趋势 计算芯片架构逐渐向深度学习应用优化的趋势发展 从传统的CPU为主GPU为辅的因特尔处理器转变为GPU为主CPU为辅的结构 性
  • JS逆向之HOOK注入、调试、插桩

    一 使用油猴脚本进行注入 获取Cookie的加密参数 新建油猴脚本文件 UserScript name cookie的HOOK namespace http tampermonkey net version 0 1 description
  • 写论文和做项目中遇到的问题及其解决办法

    相比Microsoft Office Word 我更推荐用WPS Office Word编写论文 感觉后者用起来更轻松 1 利用Word自带的的标题样式快速给文档设置一到三级标题 2 Word文档中具有编辑器自带标题样式的文字前面都有小黑方
  • 【YOLOv5-6.x】设置可学习权重结合BiFPN(Add操作)

    文章目录 前言 修改yaml文件 以yolov5s为例 只修改一处 将Concat全部换成BiFPN Add 打印模型参数 修改common py 修改yolo py 修改train py 1 向优化器中添加BiFPN的权重参数 2 查看B
  • 疼失鸡鸡,吊唁鸡鸡

    为了忘却的纪念 今天是我痛失鸡鸡的日子 一个好鸡鸡是很难找的 一个集群的鸡鸡跟难找的 为了吊唁我的鸡鸡 我觉得为它写一篇文章
  • Matplot pyplot绘制单图,多子图不同样式详解,这一篇就够了

    Matplot pyplot绘制单图 多子图不同样式详解 这一篇就够了 1 单图单线 2 单图多线不同样式 红色圆圈 蓝色实线 绿色三角等 2 1 4 支持的所有颜色及样式 3 使用关键字字符串绘图 data 可指定依赖值为 numpy r
  • 【BLE】蓝牙抓包器 Ellisys 使用说明

    BLE 蓝牙抓包器 Ellisys 使用说明 常用功能 设备过滤 抓包的类型 添加观察的项目 协议解析 连接过程 Connection Indication LLCP Feature Request Response LLCP Length
  • Java多线程通信-CountDownLatch(闭锁)

    一 CountDownLatch 闭锁 闭锁是一个同步工具类 它可以延迟线程的进度直到其到达终止状态 闭锁的作用相当于一扇门 在到达结束状态之前 这扇门是关闭的 并且不允许任何进程通过 当到达结束状态时 这扇门会打开并允许所有的线程通过 当
  • wangeditor3.0上传本地图片和本地视频至服务器

    1 效果 2 注意 我下载的3 0版本 3 组件 在components文件里创建一个wangEditoe vue文件
  • Java基于opencv实现图像数字识别(一)

    Java基于opencv实现图像数字识别 一 最近分到了一个任务 要做数字识别 我分配到的任务是把数字一个个的分开 当时一脸懵逼 直接百度java如何分割图片中的数字 然后就百度到了用BufferedImage这个类进行操作 尝试着做了一下
  • Vue生命周期和钩子函数详解

    Vue生命周期和钩子函数详解 Vue生命周期介绍 组件每个阶段它的内部构造是不一样的 所以一般特定的钩子做特定的事 比如Ajax获取数据就可以在mounted阶段 从Vue实例被创建开始到该实例最终被销毁的整个过程叫做VUE的生命周期 在这
  • A*算法学习笔记

    1 算法思路 1 Dijkstra算法与A 算法 1 Dijkstra算法 贪心策略 优先队列 集合S 已确定的顶点集合 初始只含源点s 集合T 尚未确定的顶点集合 算法反复从集合T中选择当前到源点s最近的顶点u 将u加入集合S 然后对所有
  • 使用myisamchk命令修复表 只能修复myisam表 速度块

    快速检查 myisamchk im var lib mysql db1 只检查没有正常关闭的表 myisamchk iFm var lib mysql db1 仅显示标的重要信息 myisamchk eis var lib mysql db
  • 【Markdown】Typora配置图片上传

    文章目录 0 前言 1 确定需求 2 开始配置 2 1 软件储备 2 2 插件安装 2 3 gitee配置 3 其他配置 3 1 获取SMMS token 参考链接 0 前言 对于喜欢写Markdown文档的人来说 Typora无疑是一个写
  • 30分钟学会如何使用Shiro

    http www cnblogs com learnhow p 5694876 html 一 架构 要学习如何使用Shiro必须先从它的架构谈起 作为一款安全框架Shiro的设计相当精妙 Shiro的应用不依赖任何容器 它也可以在JavaS
  • 宏定义详细知识点

    一 不带参数的宏定义 1 格式 define 宏名 字符串 例 define a 6 则a是宏名 凡是出现a的地方均用6替换 2 注意 宏替换是一种机械替换 不做语法检查 不是下一个语句 其后不加 define命令出现在函数的外面 有效范围
  • 框架中常见的设计模式有哪些学习总结第一篇

    框架中常见的设计模式有哪些 设计模式的作用 通过设计模式写代码 设计模式可以解耦 解耦只是一种思想 代码开发的时候 把代码分开便于维护和管理 运行的时候再合并起来运行 回顾软件设计原则 开闭原则 对扩展开放 对修改关闭 使用范围特变广 单一
  • c语言之实现fastcgi协议的代码完整实现

    FastCGI协议是在CGI协议的基础上发展出来的 如果想了解CGI协议 可以看我另一篇文章 动态web技术 二 CGI FastCGI程序本身监听某个socket然后等待来自web服务器的连接 而不是像CGI程序是由web服务器 fork
  • Android Studio 快速跳转到XML布局界面

    http www jianshu com p 8ca15b831b31 我们开发Android应用程序时 Activity或者Fragment会有一个相对应的布局 在Eclipse中或者一般的做法 我们会在Java代码中找到对应的代码 然后
  • jquery之ajax——全局事件引用方式以及各个事件(全局/局部)执行顺序

    jquery中各个事件执行顺序如下 1 ajaxStart 全局事件 2 beforeSend 局部事件 3 ajaxSend 全局事件 4 success 局部事件 5 ajaxSuccess 全局事件 6 error 局部事件 7 aj