加载请求: .ajaxStart() 和 .ajaxstop()

    $(document).ajaxStart(function(){
$('.loading').show();
}).ajaxStop(function(){
$('.loading').hide();
});

错误处理: .ajaxError()

    //1 $.ajax()使用属性提示错误
$('form input[type=button]').click(function(){
$.ajax({
type:"post",
url:"test1.php",
async:true,
data:$('form').serialize(),
success:function(response,status,xhr){
$('#box').html(response);
},
// timeout:3000
// global:false
error:function(xhr,errorText,errorType){
// alert(errorText + ':' +errorType);
alert(xhr.status + ':' +xhr.statusText);
} });
}); //2 $.post()使用连缀.error()方法提示错误,将被.fail()取代
$('form input[type=button]').click(function(){
$.post('test1.php').error(function(xhr,errorText,errorType){
alert(errorText + ':' +errorType);
alert(xhr.status + ':' +xhr.statusText);
});
}); //3 使用全局.ajaxError()方法
$(document).ajaxError(function(event,xhr,settings,info){
alert(event.type);
alert(event.target);
for(var i in event){ //打印出event的所有属性
document.write(i + '<br />');
}
});

.ajaxSuccess(),对应一个局部方法:.success(),请求成功完成时执行。

.ajaxComplete(),对应一个局部方法:.complete(),请求完成后注册一个回调函数。

.ajaxSend(),没有对应的局部方法,只有属性 beforeSend,请求发送之前要绑定的函数。

    //$.post()使用全局
$('form input[type=button]').click(function(){
$.post('test.php',$('form').serialize());
}); $('document').ajaxSend(function(){
alert(发送请求之前执行);
}).ajaxComplete(function(response,status,xhr){
alert('请求完成后,不管是否失败成功');
}).ajaxSuccess(function(event,xhr,settrings){
alert('请求成功后,不管是否成功');
}).ajaxError(function(event,xhr,settrings){
alert('请求失败后');
}); //$.post()使用局部
$('form input[type=button]').click(function(){
$.post('test.php',$('form').serialize()).success(function(){
alert('请求成功后');
}).complete(function(){
alert('请求完成后');
}).error(function(){
alert('请求失败后');
});
}); //$.ajax()使用属性
$('form input[type=button]').click(function(){
$.ajax({
type:"post",
url:"test1.php",
async:true,
data:$('form').serialize(),
success:function(response,status,xhr){
alert('请求成功后');
},
complete:function(){
alert('请求完成后,不管失败成功');
},
beforeSend:function(){
alert('发送请求之前');
},
error:function(xhr,errorText,errorType){
alert('请求失败后');
}
});
});

注:

jQuery1.5 版本以后,使用.success().error().complete()连缀的方法,可以用.done().fail().always()取代。

Ajax :六个全局事件的更多相关文章

  1. jquery的ajax全局事件详解

        jquery在ajax方面是非常强大和方便的,以下是jquery进行ajax请求时方法模板: $.ajax({ type: "get", url: "" ...

  2. 关于数据未渲染完,要获取document高度问题——ajax全局事件

    昨天在做开发时,遇到这样一个问题,当页面刚加载的时候,就要获取document的高度,可是此时页面上所有的ajax请求的数据都还没有渲染到页面上,所以导致得到的document的高度仅仅是页面结构的高 ...

  3. Jquery表单序列化和AJAX全局事件

    Jquery表单序列化 1.必须放在form标签内: 2.控件必须有name属性: 3.控件的value值会提交到服务器: 如: <form id="form1"> & ...

  4. 锋利的jQuery读书笔记---jQuery中Ajax--序列化元素、Ajax全局事件

    serialize()方法: 作用于一个jQuery对象,它能够将DOM元素内容序列化为字符串,用于Ajax请求. <!DOCTYPE html> <html> <hea ...

  5. ajax全局事件

    作用:当你的页面存在很多ajax事件的话,我们有一些信息是公共的,可以复用,我们可以用全局事件进行编写,因为每一个ajax事件调用,都会触发ajax全局事件. jquery的ajax方法的全部全局事件 ...

  6. jquery ajax 全局事件

    jquery的ajax方法的全部全局事件:(不管是$.ajax().$.get().$.load().$.getJSON()等都会默认触发全局事件) ajaxStart:ajax请求开始前 ajaxS ...

  7. jQuery中的Ajax全局事件

    Ajax全局事件 全局事件会在有ajax请求的情况下触发. 方法名称 说明 ajaxStart(callback) Ajax请求开始时执行的函数 ajaxStop(callback) Ajax请求结束 ...

  8. nprogress进度条和ajax全局事件

    nprogress和ajax全局事件 nprogress 官方网站:http://ricostacruz.com/nprogress/ 下载地址:https://github.com/rstacruz ...

  9. 【锋利的jQuery】中全局事件ajaxStart、ajaxStop不执行

    最近一直都在研究[锋利的jQuery],确实是一本好书,受益匪浅.但由于技术发展及版本更新等原因,里面还是有些坑需要踩的. 比如:第六章七节中提到的全局事件ajaxStart.ajaxStop照着案例 ...

随机推荐

  1. 基础apache命令

    在启动Apache服务之前,可以使用下面的命令来检查配置文件的正确性. C:\Apache2.2\bin> httpd  -n  Apache2.2  -t 还可以通过命令行控制Apache服务 ...

  2. Core篇——初探依赖注入

    目录 1.DI&&IOC简单介绍 2.UML类图中六种关联关系 3..net core 中DI的使用 4..net core DI初始化源码初窥 DI&&IOC简单介绍 ...

  3. (转)Django学习之 第三章:动态Web页面基础

    上一章我们解释了怎样开始一个Django项目和运行Django服务器 当然了,这个站点实际上什么也没有做------除了显示了"It worked"这条信息以外. 这一章我们介绍怎 ...

  4. call使用场景

    在javascript OOP中,定义: function cat(){    }    cat.prototype={    food:"fish",    say: funct ...

  5. 转载:【学习之家】Python中__init__.py文件的作用

    Python中__init__.py文件的作用详解 Python中__init__.py文件的作用详解 来源:学习之家 作者:xuexi110 人气:357 发布时间:2016-09-29 摘要:__ ...

  6. js input 只能输入数字

    HTML网页上这么写 <input type="text" style="ime-mode:disabled;" onpaste="return ...

  7. Android 7.0 Gallery图库源码分析1 - 初识Gallery源码

    分析一个项目的源代码时,第一件事就是查看清单文件,找到程序入口,我们从Gallery2源码的清单文件中可以看到GalleryActivity是此应用的启动Activity. <activity ...

  8. js单体内置对象

    js单体内置对象:js的内置对象,是ECMAScritp提供的.不依赖于宿主环境的对象,我的理解就是在我们开发之前js里面就已经存在的对象.单体内置对象就是是不需要通过new来实例化的,例如我们的st ...

  9. 广义线性模型------逻辑回归和softmax回归

    1.广义线性模型 2.逻辑回归 3.softmax回归

  10. 一些css布局

    # css布局 #---bootstrap   详情请看官方文档---首先要按照相应的官方规范引入相应的css js fonts等 container相当于一个容器 一般设置一个 接下来设置行 用ro ...