js $.ajax stop,jQuery.ajaxStop() 函数详解
ajaxStop()函数用于为AJAX请求的ajaxStop事件绑定处理函数。
这是一个全局AJAX事件函数,用于在ajaxStop事件被触发时执行绑定的事件处理函数。
jQuery官方文档描述:无论什么时候,当一个AJAX请求完成(无论成功或失败)时,jQuery会检查当前是否还有其他活跃的(未完成的)AJAX请求。如果在进程中没有找到其他活跃的AJAX请求,jQuery就会触发ajaxStop事件。此时,通过ajaxStop()函数绑定的所有事件处理函数都将被执行。
简而言之,当一个AJAX请求结束的时候,此时没有其他活跃的AJAX请求,该请求就会触发ajaxStop事件。
一般而言,连续执行多个AJAX请求,只有其中最后一个结束的AJAX请求会触发ajaxStop事件。等到所有AJAX请求执行完毕后,再次连续执行多个AJAX请求,还是只有其中最后一个结束的AJAX请求会触发ajaxStop事件。
如果某个AJAX请求被禁止触发全局AJAX事件,则它不会被视为活跃的AJAX请求。
该函数必须在jQuery对象实例上调用,ajaxStop()将为每个匹配元素绑定事件处理函数。当ajaxStop事件被触发时,所有匹配元素上绑定的处理函数都将被调用。事件处理函数内的this将指向当前DOM元素。
你可以为同一元素多次调用该函数,从而绑定多个事件处理函数。触发事件时,jQuery会按照绑定的先后顺序依次执行绑定的事件处理函数。
从jQuery 1.8开始,该函数只能为document对象绑定事件处理函数,为其他元素绑定的事件处理函数不会起作用。
如果在jQuery.ajax()或jQuery.ajaxSetup()中将选项参数global设为false,可以禁止该AJAX请求触发全局的AJAX事件。
该函数属于jQuery对象(实例)。
语法
jQuery 1.0 新增该函数。
jQueryObject.ajaxStop( handler )
参数
参数描述
handlerFunction类型触发该事件时,需要执行的事件处理函数。
返回值
ajaxStop()函数的返回值为jQuery类型,返回当前jQuery对象本身。
示例&说明
关于ajaxStop事件和ajaxStop事件的触发机制,你可以参考jQuery的jQuery.ajax()函数的部分源代码。
通过以下源代码,我们可以知道:jQuery会统计当前活跃的AJAX请求数。每当开始执行一个AJAX请求时,会在活跃数上加1;每当一个AJAX请求结束时,就在活跃数上减1。如果一个AJAX请求开始时,活跃数为0,则触发ajaxStart事件;如果一个AJAX请求结束时,活跃数为0,则触发ajaxStop事件。// jQuery.ajax()函数的开头部分
var fireGlobals = s.global; // 是否允许触发全局AJAX事件
// 如果允许触发全局AJAX事件,并且活跃的AJAX请求数为0,则触发ajaxStart事件
if ( fireGlobals && jQuery.active++ === 0 ) {
jQuery.event.trigger("ajaxStart");
}
// ... 省略中间的源代码
// jQuery.ajax()函数的末尾部分
if ( fireGlobals ) {
globalEventContext.trigger( "ajaxComplete", [ jqXHR, s ] );
// 如果允许触发全局事件,并且活跃的AJAX请求数为0,则触发ajaxStop事件
if ( !( --jQuery.active ) ) {
jQuery.event.trigger("ajaxStop");
}
}
请参考以下HTML示例代码:
以下是与ajaxStop()函数相关的jQuery示例代码,以演示ajaxStop()函数的具体用法:
请注意:并不是先执行的AJAX请求就一定先结束,这与整个AJAX请求过程中的网络、数据量、相关代码执行时间等方面密切相关。下面的示例代码均假设所有AJAX请求的用时相同,以便于解释说明。
以下代码请基于1.8之前版本的jQuery来运行。var $divs = $("div");
$divs.ajaxStop( function(){
alert("处理函数1:当前元素id为" + this.id );
} );
$divs.ajaxStop( function(){
alert("处理函数2:当前元素id为" + this.id );
} );
// 点击执行AJAX请求
$("#btn").click( function(){
// 该AJAX请求结束时,下一个AJAX请求正在执行,因此不会触发ajaxStop事件,也不会弹出对话框
$.ajax( { url: "index.html" } );
// 该AJAX请求结束时,上一个AJAX请求已经执行完毕,因此会触发ajaxStop事件
// 它会弹出6次对话框 ,因为当前页面有3个div元素,我们为每个div元素绑定了2个事件处理函数
$.ajax( { url: "myurl.php" } );
} );
如果当前jQuery为1.8及以上版本,上述jQuery代码不会弹出对话框。因为从jQuery 1.8开始,ajaxStop事件的处理函数必须绑定到document对象上才能生效。
因此,不论当前jQuery为何版本,如果不是特殊需求,我们都应该将ajaxStop事件的处理函数绑定到document对象上。var $divs = $("div");
$divs.ajaxStop( function(){
alert("处理函数1");
} );
$divs.ajaxStop( function(){
alert("处理函数2");
} );
// 点击执行AJAX请求
$("#btn").click( function(){
// 该AJAX请求结束时,下一个AJAX请求正在执行,因此不会触发ajaxStop事件,也不会弹出对话框
$.ajax( { url: "index.html" } );
// 该AJAX请求结束时,上一个AJAX请求已经执行完毕,因此会触发ajaxStop事件
// 它会弹出2次对话框 ,因为我们为document绑定了2个事件处理函数
$.ajax( { url: "myurl.php" } );
} );
现在,我们参考以下jQuery代码。我们将第二个AJAX请求延迟3秒执行(或其他能保证第一个AJAX请求执行完毕的时间值),此时两个AJAX请求都会弹出对话框。var $doc = $( document );
$doc.ajaxStop( function(){
alert("处理函数1" );
} );
$doc.ajaxStop( function(){
alert("处理函数2" );
} );
// 点击执行AJAX请求
$("#btn").click( function(){
// 该AJAX请求结束时,此时没有其他活跃的AJAX请求(下一个请求尚未执行),因此会触发ajaxStop事件
// 它会弹出2次对话框
$.ajax( { url: "index.html" } );
// 延迟3秒执行第二个AJAX请求
setTimeout( function(){
// 该AJAX请求结束时,此时没有其他活跃的AJAX请求(上一个请求早已经执行完毕)
// 因此会触发ajaxStop事件,会弹出2次对话框
$.ajax( { url: "myurl.php" } );
}, 3000);
} );
如果第二个AJAX请求被禁止触发全局AJAX事件,则它不会被视作活跃的AJAX请求。第一个AJAX请求会触发ajaxStop事件。var $doc = $( document );
$doc.ajaxStop( function(){
alert("处理函数1" );
} );
$doc.ajaxStop( function(){
alert("处理函数2" );
} );
// 点击执行AJAX请求
$("#btn").click( function(){
// 该AJAX请求开始时,此时没有其他活跃的AJAX请求(下一个请求虽然尚未执行完成,但它被禁止触发全局AJAX事件,jQuery在检查活跃请求时会忽略掉它)
// 因此会触发ajaxStop事件,会弹出2次对话框
$.ajax( { url: "index.html" } );
// 该AJAX请求开始时,此时没有其他活跃的AJAX请求,但它不会触发ajaxStop事件
// 因为它的global选项为false,被禁止触发任何AJAX事件,所以它不会弹出对话框
$.ajax( {
url: "myurl.php" ,
global: false // 禁止触发全局AJAX事件
} );
} );
js $.ajax stop,jQuery.ajaxStop() 函数详解相关推荐
- ajaxsetup获取ajax的url_jQuery.ajaxSetup() 函数详解
该函数用于更改jQuery中AJAX请求的默认设置选项.之后执行的所有AJAX请求,如果对应的选项参数没有设置, 将使用更改后的默认设置. //设置AJAX的全局默认选项 $.ajaxSetup( { ...
- [zz]jQuery.extend 函数详解
JQuery的extend扩展方法: Jquery的扩展方法extend是我们在写插件的过程中常用的方法,该方法有一些重载原型,在此,我们一起去了解了解. 一.Jquery的扩 ...
- jquery.ajaxSetup()函数详解
jquery.ajaxSetup() 函数用于设置全局默认设置.jquery1.1新增 该静态函数 语法: jquery.ajaxSetup(settings) 参数(settings):一个对象, ...
- jQuery.parseJSON()函数详解
jQuery.parseJSON()函数用于将格式完好的JSON字符串转为与之对应的JavaScript对象. 所谓"格式完好",就是要求指定的字符串必须符合严格的JSON格式,例 ...
- jQuery.inArray() 函数详解
jQuery.inArray()函数用于在数组中搜索指定的值,并返回其索引值.如果数组中不存在该值,则返回 -1. 该函数属于全局jQuery对象. 语法 jQuery 1.2 新增该静态函数. jQ ...
- jQuery.parseJSON() 函数详解
由于偶然用到了javascript中JSON.parse和JSON.stringify,所以就查了一下jquery中有关这方面的知识,jQuery.parseJSON()这个用法,怎么用,我总结一下, ...
- jQuery.extend 函数详解
JQuery的extend扩展方法: Jquery的扩展方法extend是我们在写插件的过程中常用的方法,该方法有一些重载原型,在此,我们一起去了解了解. 一.Jquery的扩展方法原型 extend ...
- jQuery.delegate() 函数详解
delegate()函数用于为指定元素的一个或多个事件绑定事件处理函数. 此外,你还可以额外传递给事件处理函数一些所需的数据. 即使是执行delegate()函数之后新添加的元素,只要它符合条件,绑定 ...
- jQuery.ready() 函数详解
ready()函数用于在当前文档结构载入完毕后立即执行指定的函数. 该函数的作用相当于window.onload事件. 你可以多次调用该函数,从而绑定多个函数,jQuery将在DOM文档结构加载完毕后 ...
最新文章
- Android中windowTranslucentStatus与windowTranslucentNavigation的一些设置(转)
- 【企业管理】自我管理时代,你的专注度决定未来
- scala不使用new关键字创建对象实例
- 如何在线把网站html生成xml文件_快速抓取网站信息工具
- centos 7新机使用前操作
- ORACLE 物化视图
- OpenSSH升级-无需替换旧版本文件
- 脚注交叉引用序号不一样_著作权合理使用制度之“适当引用”的界定
- 入门图形学:ComputeShader
- C 小鑫の日常系列故事(七)——小纸条 SDUT
- win7或win2008系统中,出现【已停止工作,联机检查解决方案并关闭该程序,关闭程序】解决方法!
- 【翻译辅助】开源CAT翻译辅助软件OmegaT协同翻译
- 嵌入式--热敏电阻的应用
- 同程旅游缓存系统设计:如何打造Redis时代的完美体系(含PPT)
- Logistic 回归算法原理
- Flarum 宝塔完美迁移教程
- 视频大数据技术在智慧城市建设中的应用
- 广东省学计算机那间技校好,广东哪个技校最好?广东这边哪些技校好?
- 如何彻底卸载3dmax2020_「技巧」别再直接在桌面上卸载APP了,这才是手机卸载APP的正确方式!...
- ardruino控制继电器_基于Arduino使用一路继电器模块
热门文章
- Storm tick 功能
- WPF自定义控件的三种方式
- E百科 | 基于MEC的边缘AI服务
- 阿里巴巴HRSSC:用宜搭实现业务管理模式创新
- 2019年全球最受欢迎数据库新鲜出炉,你猜中了吗?
- 从MapReduce的执行来看如何优化MaxCompute(原ODPS) SQL 1
- 活动预告 | 2020移动云客户高端峰会即将揭幕,邀您一起携手云端!
- 我26岁,月薪一万,刚实现“黄焖鸡自由”(苦笑)
- 肯耐珂萨助力世界500强零售企业在线春招:单次面试3000人
- 百度现场面试:JVM+算法+Redis+数据库!(三面)| CSDN博文精选